Peso en otro planeta

📌 La función parseInt() nos sirve para convertir una cadena o número con punto decimal a un número entero.

var cadena = "12";
var numero_punto_decimal = 22.2;
var numero_entero = parseInt(cadena) + parseInt(numero_punto_decimal);

insideem

Si quieren tener dos decimales utilicen :

peso_final = parseFloat(peso_final).toFixed(2);

// el numero entre paréntesis nos indica cuantos decimales queremos.

Ervic

Apuntes de clase:

Podemos declarar variables sin asignarles algún valor.
En JavaScript tenemos funciones especiales que manipulan numeros una de esas funciones se llama parseInt, esta me permite redondear un numero con muchos decimales.
Cuando nosotros estamos asignando algo primero ocurre lo de la derecha de la asignacion y luego ocurre lo de la izquierda es decir primero la operacion ocurre y luego se le asigna a la variable.
Los titulos se pueden agregar con la etiquetas h1,h2,h3,…

Luis Enrique Carmona Manrique

hace 5 meses

Empecé este ejercicio para aprender Javascript y a medida que fuí avanzando durante el curso fuí agregando nuevas funcionalidades al programa, este es el resultado:

fue todo un reto, desde la programación hasta el diseño y como extra mejoré mi inglés ya que decidí programarlo en ese idioma. Debajo de la imagen dejaré el codigo

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <style media="screen">
    html
    {
      width: 100%;
      height: 100%;
    }
    body
    {
      min-width: 100vh;
      min-height: 100vh;
      margin: 0%;
      padding: 0;
      padding-left: 5%;
      padding-right: 5%;
      margin-top: 0;
      padding-top: 0;
      background-color: #224042;
      color: white;
    }
    .firstTitle
    {
      font-family: "coolvetica";
      src: url("../fonts/Coolvetica Rg.otf" format("truetype"));
      font-weight: normal;
      font-style: normal;
      font-size: 25pt;
      background: linear-gradient(to right, #177780, #2decfe);
      -webkit-background-clip: text;
      color: transparent;
      text-align: center;
    }
    /*generated with Input range slider CSS style generator (version 20211225)
    https://toughengineer.github.io/demo/slider-styler*/
    input[type=range].styled-slider
    {
      height: 5px;
      width: 100%;
      -webkit-appearance: none;
      background: #224042;
    }

    /*progress support*/
    input[type=range].styled-slider.slider-progress
    {
      --range: calc(var(--max) - var(--min));
      --ratio: calc((var(--value) - var(--min)) / var(--range));
      --sx: calc(0.5 * 20px + var(--ratio) * (100% - 20px));
    }

    input[type=range].styled-slider:focus
    {
      outline: none;
    }

    /*webkit*/
    input[type=range].styled-slider::-webkit-slider-thumb
    {
      -webkit-appearance: none;
      width: 20px;
      height: 20px;
      border-radius: 1em;
      background: #ffffff;
      border: none;
      box-shadow: 0 0 0 4px #224042;
      margin-top: calc(10px * 0.5 - 20px * 0.5);
    }

    input[type=range].styled-slider::-webkit-slider-runnable-track
    {
      height: 10px;
      border: none;
      border-radius: 10px;
      background: #224042;
      box-shadow: inset 1px 1px 2px #0e1a1a,inset -1px -1px 2px #36666a;
      box-shadow: none;
    }

    input[type=range].styled-slider::-webkit-slider-thumb:hover
    {
      background: #ffffff;
    }

    input[type=range].styled-slider:hover::-webkit-slider-runnable-track
    {
      background: #224042;
    }

    input[type=range].styled-slider::-webkit-slider-thumb:active
    {
      background: linear-gradient(to right, #177780 , #2DECFE);
    }

    input[type=range].styled-slider:active::-webkit-slider-runnable-track
    {
      background: #224042;
    }

    input[type=range].styled-slider.slider-progress::-webkit-slider-runnable-track
    {
      background: linear-gradient(to right, #177780 , #2DECFE) 0/var(--sx) 100% no-repeat, #224042; box-shadow: inset 1px 1px 2px #0e1a1a,inset -1px -1px 2px #36666a;;
    }

    input[type=range].styled-slider.slider-progress:hover::-webkit-slider-runnable-track
    {
      background: linear-gradient(to right, #177780 , #2DECFE) 0/var(--sx) 100% no-repeat, #224042;
    }

    input[type=range].styled-slider.slider-progress:active::-webkit-slider-runnable-track
    {
      background: linear-gradient(to right, #177780 , #2DECFE) 0/var(--sx) 100% no-repeat, #224042;
    }

    /*mozilla*/
    input[type=range].styled-slider::-moz-range-thumb
    {
      width: 20px;
      height: 20px;
      border-radius: 1em;
      background: #ffffff;
      border: none;
      box-shadow: 0 0 0 4px #224042;
    }

    input[type=range].styled-slider::-moz-range-track
    {
      height: 10px;
      border: none;
      border-radius: 10px;
      background: #224042; box-shadow: inset 1px 1px 2px #0e1a1a,inset -1px -1px 2px #36666a;;
      box-shadow: none;
    }

    input[type=range].styled-slider::-moz-range-thumb:hover
    {
      background: #ffffff;
    }

    input[type=range].styled-slider:hover::-moz-range-track
    {
      background: #224042;
    }

    input[type=range].styled-slider::-moz-range-thumb:active
    {
      background: linear-gradient(to right, #177780 , #2DECFE);
    }

    input[type=range].styled-slider:active::-moz-range-track
    {
      background: #224042;
    }

    input[type=range].styled-slider.slider-progress::-moz-range-track
    {
      background: linear-gradient(to right, #177780 , #2DECFE) 0/var(--sx) 100% no-repeat, #224042; box-shadow: inset 1px 1px 2px #0e1a1a,inset -1px -1px 2px #36666a;;
    }

    input[type=range].styled-slider.slider-progress:hover::-moz-range-track
    {
      background: linear-gradient(to right, #177780 , #2DECFE) 0/var(--sx) 100% no-repeat, #224042;
    }

    input[type=range].styled-slider.slider-progress:active::-moz-range-track
    {
      background: linear-gradient(to right, #177780 , #2DECFE) 0/var(--sx) 100% no-repeat, #224042;
    }

    /*ms*/
    input[type=range].styled-slider::-ms-fill-upper
    {
      background: transparent;
      border-color: transparent;
    }

    input[type=range].styled-slider::-ms-fill-lower
    {
      background: transparent;
      border-color: transparent;
    }

    input[type=range].styled-slider::-ms-thumb
    {
      width: 20px;
      height: 20px;
      border-radius: 1em;
      background: #ffffff;
      border: none;
      box-shadow: 0 0 0 4px #224042;
      margin-top: 0;
      box-sizing: border-box;
    }

    input[type=range].styled-slider::-ms-track
    {
      height: 10px;
      border-radius: 10px;
      background: #224042; box-shadow: inset 1px 1px 2px #0e1a1a,inset -1px -1px 2px #36666a;;
      border: none;
      box-shadow: none;
      box-sizing: border-box;
    }

    input[type=range].styled-slider::-ms-thumb:hover
    {
      background: #ffffff;
    }

    input[type=range].styled-slider:hover::-ms-track
    {
      background: #224042;
    }

    input[type=range].styled-slider::-ms-thumb:active
    {
      background: linear-gradient(to right, #177780 , #2DECFE);
    }

    input[type=range].styled-slider:active::-ms-track
    {
      background: #224042;
    }

    input[type=range].styled-slider.slider-progress::-ms-fill-lower
    {
      height: 10px;
      border-radius: 10px 0 0 10px;
      margin: -undefined 0 -undefined -undefined;
      background: linear-gradient(to right, #177780 , #2DECFE);
      border: none;
      border-right-width: 0;
    }

    input[type=range].styled-slider.slider-progress:hover::-ms-fill-lower
    {
      background: linear-gradient(to right, #177780 , #2DECFE);
    }

    input[type=range].styled-slider.slider-progress:active::-ms-fill-lower
    {
      background: linear-gradient(to right, #177780 , #2DECFE);
    }
    #travelSystem
    {
      font-family: "Gill Sans";
      src: url("../fonts/Gill Sans.otf" format("truetype"));
      font-weight: normal;
      font-style: normal;
      font-size:18px;
      color: white;
    }
    #showResult
    {
      background: #224042;
      font-family: "coolvetica";
      src: url("../fonts/Coolvetica Rg.otf" format("truetype"));
      font-weight: normal;
      font-style: normal;
      font-size: 18pt;
      background: linear-gradient(to right, #177780, #2decfe);
      -webkit-background-clip: text;
      color: transparent;
    }

    #weigthNumber
    {
      text-align: center;
      height: 20px;
    }

    #buttonDiv
    {
      width: 100%;
      text-align: center;
    }
    .mercuryDiv, .venusDiv, .marsDiv, .jupiterDiv, .saturnDiv, .uranusDiv, .neptuneDiv
    {
      float: left;
      width: 14.28%;
      height: 25vh;
      text-align: center;
      position: relative;
    }

    input[type=radio]
    {
      height: 20vh;
      width: 20vh;
      border: none;
      opacity: 0;
    }

    .mercuryImage, .venusImage, .marsImage, .jupiterImage, .neptuneImage
    {
      background-image: url("planetImage3.png");
      background-size: 55%, 55%;
      background-position: center;
      background-repeat: no-repeat;
      height: 20vh;
      width: 20vh;
      border-radius: 100%;
    }
    .saturnImage, .uranusImage
    {
      background-image: url("planetImage4.png");
      background-size: 70%, 70%;
      background-position: center;
      background-repeat: no-repeat;
      height: 20vh;
      width: 20vh;
      border-radius: 100%;
    }
    .mercuryImage:focus-within, .venusImage:focus-within, .marsImage:focus-within, .jupiterImage:focus-within, .neptuneImage:focus-within
    {
      background-image: url("planetImage1.png");
      background-size: 55%, 55%;
      background-position: center;
      background-repeat: no-repeat;
      height: 20vh;
      width: 20vh;
      border-radius: 100%;
    }

    .saturnImage:focus-within, .uranusImage:focus-within
    {
      background-image: url("planetImage2.png");
      background-size: 70%, 70%;
      background-position: center;
      background-repeat: no-repeat;
      height: 20vh;
      width: 20vh;
      border-radius: 100%;
    }

    .mercurySet, .venusSet, .marsSet, .jupiterSet, .saturnSet, .uranusSet, .neptuneSet
    {
      background:  #224042;
      box-shadow:  12px 12px 25px #182d2f,
                 -12px -12px 25px #2c5355;
      height: 20vh;
      width: 20vh;
      border-radius: 100%;
      text-align: center;
      margin-left: 3.21vh;
    }

    .mercurySet:focus-within, .venusSet:focus-within, .marsSet:focus-within, .jupiterSet:focus-within, .saturnSet:focus-within, .uranusSet:focus-within, .neptuneSet:focus-within
    {
      background: #224042;
      box-shadow: inset 12px 12px 25px #1d3638,
                inset -12px -12px 25px #274a4c;
      height: 20vh;
      width: 20vh;
      border-radius: 100%;
      text-align: center;
      margin-left: 3.21vh;
    }

    #ready
    {
      background: #224042;
      font-family: "coolvetica";
      src: url("../fonts/Coolvetica Rg.otf" format("truetype"));
      font-weight: normal;
      font-style: normal;
      font-size: 18pt;
      text-align: center;
      margin-top: 6vh;
      border-radius: 92px;
      width: 33vh;
      height: 11vh;
      border: none;
      outline: none;
      box-shadow:  20px 20px 60px #0e1a1a,
                 -20px -20px 60px #36666a;
      background: linear-gradient(to right, #177780, #2decfe);
      -webkit-background-clip: text;
      color: transparent;
    }
    #ready:active
    {
      background: #224042;
      box-shadow:  inset 20px 20px 60px #0e1a1a,
                  inset -20px -20px 60px #36666a;
      color: #0e1a1a;
    }
    .resultsAndInfo
    {
      width: 100%;
      height: 25vh;
      margin-top: 6vh;
    }
    .imagePlanet
    {
      width: 27.9%;
      height: 100%;
      border-radius: 30px;
      margin-right: 6vh;
      float: left;
      box-shadow:  20px 20px 60px #0e1a1a,
                  -20px -20px 60px #36666a;
      background-size: 100%, 100%;
      object-fit: contain;
      text-align: center;
      background-position: center;
    }
    #infoPlanet
    {
      font-family: "Gill Sans";
      src: url("../fonts/Gill Sans.otf" format("truetype"));
      font-weight: normal;
      font-style: normal;
      font-size:15pt;
      height: auto;
    }

    </style>
    <title>how heavy you are in another planet?</title>
  </head>
  <body>
    <h1 class="firstTitle">choose your weigth and Planet<h1>
    <form id="travelSystem" action="index.html" method="post">
      <input type="range" id="earthWeight" min="0" max="500" step="1" class="styled-slider slider-progress" value="0">
      <br>
      <div id="weigthNumber">
      </div>
      <br>
      <div class="planetsDiv">
        <div class="mercuryDiv">
          <div class="mercurySet">
            <div class="mercuryImage">
              <input type="radio" name="Mercury" value="1" id="mercuryInput">
              <br>
              <label for="">Mercury </label>
            </div>
          </div>
        </div>
        <div class="venusDiv">
          <div class="venusSet">
            <div class="venusImage">
              <input type="radio" name="Venus" value="2" id="venusInput">
              <br>
              <label for="">Venus</label>
            </div>
          </div>
        </div>
        <div class="marsDiv">
          <div class="marsSet">
            <div class="marsImage">
              <input type="radio" name="mars" value="3" id="marsInput">
              <br>
              <label for="">Mars</label>
            </div>
          </div>
        </div>
        <div class="jupiterDiv">
          <div class="jupiterSet">
            <div class="jupiterImage">
              <input type="radio" name="jupiter" value="4" id="jupiterInput">
              <br>
              <label for="">Jupiter</label>
            </div>
          </div>
        </div>
        <div class="saturnDiv">
          <div class="saturnSet">
            <div class="saturnImage">
              <input type="radio" name="Saturn" value="5" id="saturnInput">
              <br>
              <label for="">Saturn </label>
            </div>
          </div>
        </div>
        <div class="uranusDiv">
          <div class="uranusSet">
            <div class="uranusImage">
              <input type="radio" name="Uranus" value="6" id="uranusInput">
              <br>
              <label for="">Uranus </label>
            </div>
          </div>
        </div>
        <div class="neptuneDiv">
          <div class="neptuneSet">
            <div class="neptuneImage">
              <input type="radio" name="Neptune" value="7" id="neptuneInput">
              <br>
              <label for="">Neptune</label>
            </div>
          </div>
        </div>
      </div>
      <br>
    </form>
    <div id="buttonDiv">
      <input type="button" name="listo" value="Let's Start!" id='ready'>
    </div>
    <div class="resultsAndInfo" id="resultsAndInfo">
      <div class="imagePlanet" id="imagePlanet">
      </div>
      <p id="infoPlanet"></p>
      <p id="showResult"></p>
    </div>
  </body>
  <script type="text/javascript">
  //Gravity of planets

  var gravityMercury = 3.7;
  var gravityVenus = 8.87;
  var gravityEarth = 9.8;
  var gravityMars = 3.7;
  var gravityJupiter = 24.8;
  var gravitySaturn = 10.44;
  var gravityUranus = 8.87;
  var gravityNeptune = 11.15;

  // This arrays save the planet's data for showing up on screen
  var infoPlanetScreen = [];
  var infoMercury = ["Mercury", "3.8 m/s²", "35.98 million miles", "58d 15h 30m", "url(Mercury.jpg)"]
  var infoVenus = ["Venus", "8.87 m/s²", "67.24 million miles", "116d 18h 0m", "url(Venus.jpg)"]
  var infoMars = ["Mars", "3.7 m/s²", "141.6 million miles", "1d 0h 37m", "url(Mars.jpg)"]
  var infoJupiter = ["Jupiter", "24.8 m/s²", "483.8 million miles", "0d 9h 56m", "url(Jupiter.jpg)"]
  var infoSaturn = ["Saturn", "10.44 m/s²", "890.8 million miles", "0d 10h 42m", "url(Saturn.jpg)"]
  var infoUranus = ["Uranus", "24.8 m/s²", "1.784 million miles", "0d 17h 14m", "url(Uranus.jpg)"]
  var infoNeptune = ["Neptune", "11.15 m/s²", "2.793 million miles", "0d 16h 6m", "url(Neptune.jpg)"]

  var weigthMercury;
  var weigthVenus;
  var weigthEarth;
  var weigthMars;
  var weigthJupiter;
  var weigthSaturn;
  var weigthUranus;
  var weigthNeptune;
  var weigthResult;

  var planet;
  var gravity;

  var boxMercury = document.getElementById("mercuryInput");
  var boxVenus = document.getElementById("venusInput");
  var boxMars = document.getElementById("marsInput");
  var boxJupiter = document.getElementById("jupiterInput");
  var boxSaturn = document.getElementById("saturnInput");
  var boxUranus = document.getElementById("uranusInput");
  var boxNeptune = document.getElementById("neptuneInput");
  var weigthSelector = document.getElementById("earthWeight");
  var weigthNumber = document.getElementById("weigthNumber");
  var planetInfo = document.getElementById("resultsAndInfo");
  var planetView = document.getElementById("imagePlanet");

  var travel = document.getElementById("ready");
  var result = document.createElement("div");
  var information = document.createElement("div");
  var weigthNumberChooser = document.createElement("div");

  var astroInput = document.querySelector("#earthWeight");
  var showResult = document.getElementById("showResult");
  var infoPlanet = document.getElementById("infoPlanet")

  mercuryInput.addEventListener("click", checkMercury);
  venusInput.addEventListener("click", checkVenus);
  marsInput.addEventListener ("click", checkMars);
  jupiterInput.addEventListener ("click", checkJupiter);
  saturnInput.addEventListener("click", checkSaturn);
  uranusInput.addEventListener("click", checkUranus);
  neptuneInput.addEventListener("click", checkNeptune);
  travel.addEventListener ("click", traveling);

  astroInput.addEventListener("input", updateValue);

  function updateValue(e) // this function takes the range's value that's choosed by the user
  {
    weigthEarth = parseInt(e.target.value);

    weigthNumber.textContent = e.target.value + " lb.";
    weigthNumber.appendChild(weigthNumberChooser);
  }

  // check's functions was made it to user's can choose only one planet on screen
  function checkMercury()
  {
    venusInput.checked = false;
    marsInput.checked = false;
    jupiterInput.checked = false;
    saturnInput.checked = false;
    uranusInput.checked = false;
    neptuneInput.checked = false;

    planet = "Mercury";
  }
  function checkVenus()
  {
    mercuryInput.checked = false;
    marsInput.checked = false;
    jupiterInput.checked = false;
    saturnInput.checked = false;
    uranusInput.checked = false;
    neptuneInput.checked = false;

    planet = "Venus";
  }
  function checkMars()
  {
    mercuryInput.checked = false;
    venusInput.checked = false;
    jupiterInput.checked = false;
    saturnInput.checked = false;
    uranusInput.checked = false;
    neptuneInput.checked = false;

    planet = "Mars";
  }
  function checkJupiter()
  {
    mercuryInput.checked = false;
    venusInput.checked = false;
    marsInput.checked = false;
    saturnInput.checked = false;
    uranusInput.checked = false;
    neptuneInput.checked = false;

    planet = "Jupiter";
  }
  function checkSaturn()
  {
    mercuryInput.checked = false;
    venusInput.checked = false;
    marsInput.checked = false;
    jupiterInput.checked = false;
    uranusInput.checked = false;
    neptuneInput.checked = false;

    planet = "Saturn";
  }
  function checkUranus()
  {
    mercuryInput.checked = false;
    venusInput.checked = false;
    marsInput.checked = false;
    jupiterInput.checked = false;
    saturnInput.checked = false;
    neptuneInput.checked = false;

    planet = "Uranus";
  }
  function checkNeptune()
  {
    mercuryInput.checked = false;
    venusInput.checked = false;
    marsInput.checked = false;
    jupiterInput.checked = false;
    saturnInput.checked = false;
    uranusInput.checked = false;

    planet = "Neptune";
  }

  function operation()
  {
    // this function makes the numeric operation of user's weigth with planet's gravity choosed and shows the result on screen

    weigthResult = parseInt((weigthEarth * gravity) / gravityEarth);
    result.textContent = "your weigth on " + planet + " is: " + weigthResult + " lb.";
    showResult.appendChild(result);
  }

  function info() //this function use the created arrays before to show data about planets choosed
  {
    information.textContent = "Planet: " + infoPlanetScreen[0] + "\\n" + "Gravity: " + infoPlanetScreen[1] + "\\n" + "Distance from Sun: " + infoPlanetScreen[2] + "\\n" + "Day length: " + infoPlanetScreen[3] + "\\n";
    infoPlanet.appendChild(information);
    information.innerHTML = information.innerHTML.replace(/\\n/g, '<br />');
  }

  function views() // this function shows pictures of planets choosed on screen
  {
    planetView.style.backgroundImage = infoPlanetScreen[4];
  }

  function traveling()
  {
    // this function put's the variables choosed on variables to operate
    //and shows on screen while get active the other functions created before
    switch (planet) {
      case "Mercury":
              weigthResult = weigthMercury;
              gravity = gravityMercury;
              infoPlanetScreen = infoMercury;
              info();
              operation();
              views();
        break;
        case "Venus":
                weigthResult = weigthVenus;
                gravity = gravityVenus;
                infoPlanetScreen = infoVenus;
                info();
                operation();
                views();
        break;
        case "Mars":
                weigthResult = weigthMars;
                gravity = gravityMars;
                infoPlanetScreen = infoMars;
                info();
                operation();
                views();
        break;
        case "Jupiter":
                weigthResult = weigthJupiter;
                gravity = gravityJupiter;
                infoPlanetScreen = infoJupiter;
                info();
                operation();
                views();
        break;
        case "Saturn":
                weigthResult = weigthSaturn;
                gravity = gravitySaturn;
                infoPlanetScreen = infoSaturn;
                info();
                operation();
                views();
        break;
        case "Uranus":
                weigthResult = weigthUranus;
                gravity = gravityUranus;
                infoPlanetScreen = infoUranus;
                info();
                operation();
                views();
        break;
        case "Neptune":
                weigthResult = weigthNeptune;
                gravity = gravityNeptune;
                infoPlanetScreen = infoNeptune;
                info();
                operation();
                views();
        break;
      default:
      result.textContent = "ERROR you just must choose a planet ";
      document.getElementById('showResult').appendChild(result);
      }
    }

  for (let e of document.querySelectorAll('input[type="range"].slider-progress'))
  {
    e.style.setProperty('--value', e.value);
    e.style.setProperty('--min', e.min == '' ? '0' : e.min);
    e.style.setProperty('--max', e.max == '' ? '500' : e.max);
    e.addEventListener('input', () => e.style.setProperty('--value', e.value));
  }

  </script>
</html>

Carlos Galeano

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Peso en otro planeta</title>
    <style type="text/css">
      body
      {
          background-color: green;
          color: white;
          font-family: Helvetica;
      }
      strong
      {
          color: red;
      }
    </style>
  </head>
  <body>
    <h1>Descrube tu peso en otros planetas que no son la tierra</h1>
    <p>Para eso no tienes que indicar <strong> tu peso</strong></p>
      <script type="text/javascript">
				alert("Nos tienes que dar tu peso");
 			 var peso = prompt("Dinos tu peso actual")
  // planetas a trabajar: todos los del sistema solar
  		var g_mercurio = 3.7;
  	var g_venus = 8.87;
		var g_tierra = 9.8;
  	var g_marte = 3.711;
  	var g_jupiter = 28.4;
 	  var g_saturno = 10.44;
  	var g_urano = 8.7;
 	  var g_neptuno = 11.15;
  	var g_pluton = 0.62;
pesoenjupiter = g_jupiter * peso / g_tierra
pesoenjupiter = parseInt(pesoenjupiter);
document.write("tu peso en jupiter es " + pesoenjupiter);
  // ensayo y error

      </script>
  </body>
</html>

Este es mi aporte a la clase 😉

Juan Cruz Panattoni

LES COMPARTO UN RESUMEN DE LOS TEMAS DADOS HASTA EL MOMENTO COMO PARA HACER UN RÁPIDO REPASO CON LOS COMENTARIOS RESPECTIVOS. ESPERO QUE LES SIRVA. SALUDOS.

<!DOCTYPE html>
<html>
<head>
<title> Título de la página </title>

<style>
/* COMENTARIOS EN .CSS /
/ ATRIBUTOS DE ETIQUETA BODY /
body
{
background-color: #AAAAFF; / ASIGNO COLOR DE FONDO DEL BODY /
color: white; / ASIGNO COLOR A LAS LETRAS DEL BODY /
font-family: Helvetica; / ASIGNO FORMATO DE LETRAS DEL BODY /
}
/ ATRIBUTOS DE ETIQUETA STRONG (NEGRITA) /
strong
{
background-color: #FFAAAA; / ASIGNO COLOR DE DE FONDO A LETRAS EN STRONG (NEGRITA) */
}
</style>

<head>
<body>
<p> “parrafo” <strong>negrita</strong> “parrafo”
</p>

<script>
// COMENTARIOS EN .JS
alert(“escribir algo”); // MUESTRA MENSAJE EN VENTANA DE PANTALLA
alert(“escribir algo” + var); // MUESTRA MENSAJE EN VENTANA DE PANATALLA Y VALOR DE VARIABLE
var x = 1; // ASIGNA UN VALOR A UNA VARIABLE
nombre = prompt(“¿Cuál es tu nombre?”); // PIDE AL USUARIO INGRESAR DATOS Y GUARDA EN VARIABLE
document.write(“escribo algo” + var); // ESCRIBO ALGO EN EL BODY Y MUESTRO VALOR DE VARIABLE
var = parseInt(var); // FUNCION QUE REDONDEA EL VALOR DE UNA VARIABLE
document.write(var); // ESCRIBO SOLAMENTE EL VALOR DE UNA VARIABLE
// COMENTARIO SE PUEDEN REALIZAR TODO TIPO DE OPERACIONES MATEMATICAS ENTRE LAS VARIABLES
<h1> TITULO </h1> // LOS TITULOS DE PUEDEN AGREGAR CON LAS ETIQUETAS h1,h2,h3,h4,h4,h5,h6
</script>

</body>
</html>

Israel Castro Urieta

Si al incrustar código JS directamente en un archivo .html la aplicación no te detecta estas variables, es necesario decirle al programa que lo reconozca. Clic en la parte inferior derecha del programa y selecciona “auto detect”.

Rafael Lopez Cordova

Cuando comenzó a explicar la regla de tres simple hasta me hizo dudar de mi conocimiento. Le puse pausa al vídeo y volví a investigar. Yo dije “Pero como es posible que Freddy no sepa la regla de tres simple”, luego le di play de nuevo y ustedes ya saben… 😂

Gerardo Gabriel Leal Garza

me llevo 2 horas (en las que intente de todo) encontrar un error a la hora de cerrar <title> </titlt> ese pequeño error hacia que el buscador no leyera todo lo demás y me aparecía toda la pag en blanco

moraleja, antes de intentar de todo revisa bien el código letra por letra jajaja

Christian David Sánchez

Aquí hay más sobre las funciones de matemáticas de Javascript: https://www.w3schools.com/js/js_math.asp

franciscopapaleo

Qué lindo está el curso, estoy aprendiendo desde cero! Pero @Freddy te pido que nos tengas compasión en el examen! 😃

Paola

Hola todos!

Hasta ahora me ha encantado la manera de enseñar de Freddy, es rápido y conciso. He ido haciendo todo paso por paso tal como él lo explica pero desde las clases anteriores he tenido un problema: cuando agrego un script (al final justo antes de cerrar el body) siempre se ejecuta antes de cargar la página, es decir, actúa como si yo hubiese puesto el script al inicio del body.

¿Cómo puedo solucionar esto?, ¿tendrá que ver con el Atom? Por favor su ayuda. Muchas gracias,

Miguel Hernandez

Hola compañeros, note algo incorrecto en la fórmula de Freddy.
Freddy esta usando la palabra “peso” para describir el concepto de “masa”; cuando tu te “pesas” en un bascula el resultado que te arroja es tu masa, ya que el resultado esta expresado en unidades de masa (kilogramos, libras etc). Tu masa no depende de la gravedad de la tierra, es por eso que no se puede resolver con la regla de tres que explica Freddy. Lo que si depende de la aceleración de la gravedad del planeta en que te encuentres es el peso, y se expresa, en unidades del Sistema Internacional como kilogramo por metro sobre segundo al cuadrado (kgm/s^2) que es igual a un Newton (1N).
La formula correcta para saber el peso de un objeto es : masa por la aceleración de la gravedad (ma), de esta forma te quedara en unidades de fuerza (Newtons) ya que kg(m/s^2) = 1N.
Es importante utilizar la formula correcta porque, aunque el código funcione el resultado que le arrojara al usuario es incorrecto.
Si alguien encuentra algún error en mi procedimiento por favor háganmelo saber, saludos.

Cesar esteban Guerrero fernandez

si ven esos codigos en los titulos y h1 ? son emoticones de planetas y cohetes en html los pueden buscar en emoji tierra donde hay emoticones hecho codigo saludos 😄

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>&#127758; tu peso en otros planetas &#129680;</title>
</head>
<body>
    <h1>
        tu peso en otro planeta
    </h1>
            <p>
                en la tierra pesas distinto que en otros planetas &#128640; 
            </p>
    <script>
        var g_tierra = 9.8;
        var g_marte = 3.7;
        var g_jupiter = 24.8;
        var peso = 56;
        var peso_final;
        peso_final = peso * g_marte / g_tierra;
        peso_final = parseInt (peso_final);
        document.write(peso_final);
    </script>
</body>
</html>

Juan Carlos Lizcano Paez

para la negrita tambien sirve <b>…</b> por <strong>

laodcom

Para dejar 2 decimales.
peso_final = parseFloat(peso_final).toFixed(2);

aston bell

Luis Ruiz Ramos

❤️

alexander garcia castañeda

a modo de retroalimentación, si una persona tiene una masa de 77kg (lo que reporta la balanza) su peso es de 77*9.8, el factor de conversión que usa freddy es para cuando tenemos un dato que es de peso, pero 77 kg es un dato de masa

Ahmed Reyes

hace 7 meses

Yo: Prestando atención.
Freddy: Esto es un error!
Yo: Chale, verdad.

Christopher Joel Delvicier Palacios

Siento que me ensañan con peras y manzanas :3 me parece bien 😄

alfredonpb

Hola, les envió el código HTML, el Js y la imagen de del diseño donde quiero mostrar los resultados en cada imputs del HTML (disculpen la identación).

<div class="container ">
    <div class="row">
	<div class="colmd-4">
		<p">Metabolismo Basal</p>		<hr>
<form action="" id="formulario">
    <div class="for-group mb-3">		<label for="nombre">Sexo:</label><br>
	<input type="radio"  name="sexo" id="mujer" value="Mujer"> Mujer
<input type="radio"  name="sexo" id="hombre" value="Hombre"> Hombre
</div>
<div>
<label for="nombre">Peso corporal</label>
<input type="number" class="form-control"
name="peso" id="peso2">
</div>	
<div>
<label for="nombre">Estatura (Talla o Altura)</label>
<input type="number"  name="estatura" id="talla2"></div>
<div class="for-group mb-2">
<label for="nombre">Edad</label>
<input type="number" name="edad" id="edad2">
	</div>
<p >Tu metabolismo basal es:</p>
<input type="text"id="resultado2" readonly>
					
<input type="submit" value="Calcular" id="submit" >	
</div>
</form>

El código Js tome el ID del form, declare variables tomando el ID respectivo de cada imput para obtener su valor númerico, los imputs son de tipo “number”, declare 3 constantes con sus respectivos valores. Cree la función “metabolismoHombre” y les pase sus parámetros según las variables globales declaradas. Ejecute la función de una suma algebraica pidiendo el resultado a tarvés de un “return” pero no me mostraba ningún valor. Le pase a cada parámetro su valor numérico (cosa que no debería ser porque pensé que los obtendría declarándolos con variables al antes de la función) .

Al pasarle esos parámetros manualmente y actualizar el navegador me mostró el resultado en el imput que está antes del botón de ""Calcular, lo que quiere decir que realizo la función sin haber clickleado el botón, cosa que está mal.

Para finalizar, les envío la nueva imagen donde se muestra el resultado de la función.

Estaba muy animado al principio cuando creia tener la solución, pero luego de tratar de hacer cálculos no obtengo los resultados esperados, sé que la programación puede llegar a ser frustrante y la emoción de haber hecho algo bien se vuelve efímera cuando algo no da resultados positivos. De la alegría se pasa a la frustración… Disculpen tanto texto.

![]()```
<code>
var formulario = document.getElementById(‘formulario’),
peso = parseFloat(document.getElementById(‘peso2’).value),
talla = parseFloat(document.getElementById(‘talla2’).value),
edad = parseFloat(document.getElementById(‘edad2’).value),
constante1 = 10,
constante2 = 6.25,
constante3 = 5,

<div class=“col-md-4 col-xl-4”>
<p class=“px-2 py-2 mt-5 h2 bg-primary text-white text-center”> MB y Actividad física </p>
</div>

<div class=“col-md-3 col-xl-3”> <p>Tu valoración</p>
<p>El resultado de tu MB es:</p>
<input type=“text” id=“resultado2” class=“form-control mb-2” readonly="">
</div>
</div>
</div>
</div>
<code>


	mb_hombre = 5;
 
function metabolismoHombre(peso, constante1, constante2, talla, constante3, edad, mb_hombre){
   var resultado = ((constante1*peso) + (constante2 * talla) - (constante3 * edad) + mb_hombre);
	return resultado;
	}
 
formulario.addEventListener('submit', metabolismoHombre);
 
var mostrar = metabolismoHombre (80,10,6.25,168,5,41,5);
mostrar = (mostrar.toFixed(2));
mostrar = document.getElementById('resultado2').value = mostrar;``

Karen Lorena Poveda Lasprilla

estuve probando peso_final = parseInt(peso_final); en otra línea que no fuera donde la puso Freddy y (contrario a lo que el dice) no funciona en cualquier lado, y tiene sentido que no funcione, ya que esa operación que hace con parseInt debe ir después de haber calculado el número y antes de mostarlo en pantalla.

JavierFL

La masa es diferente del peso, en ese caso la masa es 77 kg y el peso es la masa por la gravedad, es decir aproximadamente 770 Newtons (Newton = kg*m/seg2). Es decir, así yo vaya a marte o jupiter, voy a tener la misma masa (77 kg) pero si un peso diferente que sería para marte 285 Newtons y jupiter 1910 Newtons. No se puede decir que si voy a marte mi masa será 29 kg porque la materia estaría desapareciendo, esa ecuación es una regla de tres pero que no se aplica en la vida real debido al balance de materia.

Dream desconocido

hace 7 meses

Cuando se declaran un conjunto de variables de forma consecutiva se puede realizar de la siguiente manera:
<script>
var g_tierra = 9.8,
g_marte = 3.7,
g_jupiter = 24.8;

</script>
Separando las variables por una coma, de esta forma te ahorraras escibir la palabra var tantas veces como variables tengas.

TheMandalorian

Hola Freddy y Platzi!! aprendí HTML y PHP en 2010 y lo hacía con bloc de notas! Por cuestiones del destino (oportunidad laboral), me dediqué a la rama de la infraestructura IT durante casi 5 años. (Y agridulcemente suspendí la programación en mi vida). Hace 2 años he vuelto a involucrarme en el mundo del software, primero con base de datos y testing, y ahora estoy muy feliz de volver a programar con todos los jugetes!!
Me encanta la metodología de Platzi, me parece super que enseñes con mini proyectos interesantes!

David Santiago Jimenez

Apenas tengo 13 años y ya estoy queriendo aprender a programar :3, ojala sea posible

Thiago Ampuero Gutierrez

Mi Atom no funciona bien, porq literalmente hize todo lo que explico freedy en su atom y a mi me sale diferente en esa pagina en blanco

Edwin Vasquez

hace 2 meses

Existe una función para declarar la cantidad de dígitos después del punto decimal, toFixed, su utilización:

peso_final = peso_final.toFixed(2);

Jhon Bustamante Alarcón

hace 9 meses

Estaba emocionado con el curso pero tengo dos puntos que me parecen importantes que los trabajen los del equipo de Platzi.

hacer un video explicando la funcionalidad del programa Atom, su configuraciòn y demàs. muchos de los que estamos aquì somos nuevos y es la primera vez que entramos al mundo de la programaciòn. El instructor si bien expone bien, lo hace de manera acelerada y aqui va mi segunda inconformidad. Leyendo comentarios veo que a muchos como a mi les pasó que el el paso de colocar el alert o el document.write, y recargar la pagina nada sucedió. revisé el lenguaje y todo esta conforme a lo que se muestra en pantalla y sin embargo, no aparecian las alertas. de esta manera imposible avanzar ya que en el curso el instructor no se toma unos minutos para aclarar esas dudas y errores que son comunes y que novatos como es mi caso no sabemos resolver. Muy mal eso por parte de este curso.

Juan Araujo

Para los que no le sale el código en color, solo borren la etiqueta de cierre en script “>” y la agregan nuevamente. Saludos!!

Maria Auxiliadora Sanchez

Yo me decidí por Visual Code!!!

Héctor González Mojarro

Que padre es aprender así, todo es tan amigable y efectivo, poco a poco despierta la pasión por la materia.

mariateresabaron

Realmente se hace muy sencillo para quienes tienen bases algebraicas, sin embargo Freddy tiene una gran pedagogía para enseñar!

Gerardo Raffaelli

a mi no se me ejecuta java script y está igual que en el video

deadPuppy

En realidad el peso es la masa (kg) x gravedad (m/s²). Por lo que la ecuación --> peso_final = peso * g_marte / g_tierra es incorrecta. A lo que él llama peso en realidad es la masa. Soy consciente de que está hecho con fines didácticos pero creo que era necesario remarcarlo.

Santiago Hernandez

no se si hay etiquetas adicionales para crear fuentes para los titulos

Jose Mauricio Terrones Acevedo

es mas simple sacar a parte cuanto masas y luego multiplicar tu masa por la gravedad de dichos astros.

Elián Mijel Moisés

Buenas, el script con las variables no me funciona, incluso copiando y pegando exactamente lo mismo.

Jhon Abou

No estamos gordos, Solo que nos equivocamos de planeta …

Mariana Osorio Penagos

Definitivamente que satisfacción encontrar el error en el código que estas haciendo, corregirlo, entender el porque y que funcione ❤️

César David González Abril

Si escriben " html:5 " al iniciar el script, se abre un código predeterminado que incluye iDOCTYPE html, html, head, title y body. De esta manera agilizan un poco el proceso de escritura.

Marienger Paola Chavez Ariza

hace 10 meses

Dentro de var puedo agregar todos los datos? O cada dato debe tener su var? Ejemplo: var x = 1; y = 2; z = x + y; O debe ir: var x = 1; Var y = 2; Var z = x + y;

herxsie

Uso VSCode y lo que hago es guardar primero el HTML y al escribir htm… sale la opcion HTML5, le doy click y se hace la estructura sola

👇🏻

Carolina Ramírez

Curioso
Puse el alert(“peso_final”); y me apareció el aviso ese texto pero volví a escribir como muestra el video alert(peso_final); y me pasareció el numero. La diferencia fue quitar las comillas.

Jose Luis Barbosa Cepeda

Hola, vengo a compartirles mi progreso, empeze con platzi en agosto y he estado muy contento aprendiendo la ruta de desarrollo web, estaba practicando lo poco que se hasta ahora y me acorde de esta clase por lo que quise intentar hacer este mismo programa pero con los conocimientos que se hasta ahorita c:, les dejo el repositorio del proyecto y la pagina de github pages 😄, no se rindan y nunca paren de aprender ❤️
Peso en otros planetas | repositorio
Peso en otros planetas | pagina web

Luis Elias Fernandez

https://dimorenop.github.io/Peso-en-otro-planeta/

Un tip interesante es que en Visual Studio Code (Y supongo que en otros editores también) al escribir hmlt se abre un menú desplegable y al clickear en algunas de las opciones como HTML:5 se autorellena todas las etiquetas básicas

Yuxany Martinez

hace un mes

Acá mi aporte fue agregar el resto de los planetas y el uso del <br/> como espaciado entre lineas para darle orden visual a los mismos, espero les pueda ayudar en algo ❤️

<code> 
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>Peso en otro planeta</title>
    <style type="text/css">
    body
    {
      background-color: orange;
      color: black;
      font-family: fantasy;
    }
    strong
    {
    color: red;
    }
    </style>

    </head>
<body>
  <h1>Descubre tu peso en otros planetas que no son la tierra</h1>
  <p>Para eso tienes que indicar <strong>tu peso</strong> </p>
  <script type="text/javascript">
    alert("Nos tienes que dar tu peso");
    var peso = prompt("Dinos tu peso actual ")

    var g_mercurio = 3.7;
    var g_venus = 8.87;
		var g_tierra = 9.8;
  	var g_marte = 3.711;
  	var g_jupiter = 28.4;
 	  var g_saturno = 10.44;
  	var g_urano = 8.7;
 	  var g_neptuno = 11.15;
  	var g_pluton = 0.62;
pesoenmercurio = parseInt(g_mercurio * peso / g_tierra);
pesoenvenus = parseInt(g_venus * peso / g_tierra);
pesoenmarte = parseInt(g_marte * peso / g_tierra);
pesoenjupiter = parseInt(g_jupiter * peso / g_tierra);
pesoensaturmo = parseInt(g_saturno * peso / g_tierra);
pesoenurano = parseInt(g_urano * peso / g_tierra);
pesoenneptuno = parseInt(g_neptuno * peso / g_tierra);
pesoenpluton = parseInt(g_pluton * peso / g_tierra);

  document.write("tu peso en mercurio es: " + pesoenmercurio + " kg <br/> ");
  document.write("tu peso en venus es: " + pesoenvenus + "kg <br/> ");
  document.write("tu peso en marte es: " + pesoenmarte + "kg  <br/> ");
  document.write("tu peso en jupiter es: " + pesoenjupiter + "kg <br/> ");
  document.write("tu peso en saturno es: " + pesoensaturmo + "kg <br/> ");
  document.write("tu peso en urano es: " + pesoenurano + "kg <br/> ");
  document.write("tu peso en neptuno es: " + pesoenneptuno + "kg <br/> ");
  document.write("tu peso en pluton es: " + pesoenpluton + "kg <br/> ");
   //<br/> funciona con el documen.write para hacer separaciones entre lineas
   //Logrando asi, que se vea mas ordenado.

  </script>
</body>
</html>

Diego Alejandro Moreno Pedroza

hace 2 meses

Me demoré como dos días haciendo esto! Pero aunque crean que esto es dificil, no lo es tanto!!! , les dejo el link para el que quiera cureosear

Anthony Alexander Marin Castillo

<code> 
<!DOCTYPE html>

<html>

<head>
  <title>Calcule su peso a su planeta de destino.</title>

  <STYLE type="text/css">
    .pesoCalculado {

      background-color: dodgerblue;
      color: white;
    }
  </STYLE>

</head>

<body>

  <h1>Descubra su peso en algún planeta del sistema Solar.</h1>
  <p>Recuerde que su peso, varía de acuerdo a la gravedad del planeta; en la tierra, la gravedad equivale a 9.8 m/seg al
    cuadrado.</p>

  <script type="text/javascript">

    var g_tierra = 9.8;
    var g_marte = 3.7;
    var g_jupiter = 24.8;

    //var peso = 40;
    var peso = prompt('Digite su peso actual: ');
    var peso_final;

    peso_final = peso * g_marte / g_tierra;

    document.write('<p class="pesoCalculado">Su peso en marte es: </p>' + parseInt(peso_final));

  </script>

</body>

</html>

Andrés Gutierrez

mi aporte para la clase

<!DOCTYPE html>
<html>
  <head>
    <title>Gravedad en marte</title>
    <style>
    body
    {
      background-color:black;
      color: white;
    }

    strong
    {
      background-color: white;

      /* NOTE: este es el color de la palabra planeta */
      color: #1aedb8;
    }

    </style>
  </head>
  <body>
    <!-- NOTE: h2 y h3 son más pequeños -->
    <h1>Peso en otro <strong>planeta</strong></h1>
    <script>

      var G_marte= 3.7
      var G_tierra= 9.8;
      var Peso= 56;
      var Peso_marte= Peso * G_marte / G_tierra

      Peso_marte= parseInt(Peso_marte);
      document.write("su peso en marte es "  + Peso_marte + "kg");

    </script>
  </body>
</html>

Jairo Fernando Romero Prada

LAs lecciones 8 y 7 están al revés, para que por favor la corrijan.

Luis Marino

Este video debería ser el 7 y el 7 el 8

Gael Avila

les comparto mis anotaciones para la realización de esta actividad, espero les sirva c:

En este proyecto haremos un programa capaz de calcular el peso que indique el usuario en diferentes gravedades de tres diferentes planetas (Tierra, Marte, Júpiter)

Datos necesarios para su realización:
• Peso de la gravedad en la tierra.- 9.8 m/s2
• Peso de la gravedad en Marte.- 3.7 m/s2
• Peso de la gravedad en Júpiter.- 24.8 m/s2

En esta actividad deberías hacer que el programa sea capaz de hacer una regla de tres usando los datos seleccionados por el usuario para realizar la operación y así dar el resultado

Nota.- Si quieres agregar títulos, éstos se pueden agregar utilizando la etiqueta “<h1>”, el tamaño del titulo dependerá del numero que se utilice, siendo así el 1 el titulo de mayor tamaño

Nota 2.- En la programación se puede usar una notación numérica muy compleja

Así como tenemos alerts y documents.write, en JavaScript también tenemos funciones especiales que manipulan números y una de estas funciones es “parseInt” que su función es que si nosotros anotamos un numero con muchas decimales éste codigo lo va a redondear, y este comando puede agregarse en cualquier parte del Script
Una forma de esto sería como la siguiente

Para JavaScript existen dos tipos de variables numéricas, las de tipo flotante (con decimal) y las variables de numero entero, entonces lo que hace parseInt es que convierte las variables de tipo flotante en variables de tipo entero, a su vez, hay otras funciones que te dejan un numero especifico de decimales, parseInt convierte incidentalmente cualquier dato que parezca un numero en un numero entero

Daniela Lara Lozano

Hola.
¿Por qué cuando recargo mi archivo no me deja ver la página hasta que acepto el alert? Yo veo que aquí aparece la página cargada cuando aparece el alert

Facundo Duran

El código del ejemplo con comentarios sobre la función de algunas etiquetas:

<!DOCTYPE html> 
<html>
<head> 
<title>Tu peso en un lugar donde pesas menos</title> 
</head>

<body> 
<h1>Tu peso en otro planeta</h1> 
<p>En la tierra pesas distinto que en Marte o Júpiter</p>

Francisco Quintui

disculpen tengo un problema pasa que el alert me sale antes que el texto de fondo y este no me carga hasta que acepto la alerta (y el alert lo pongo abajo de las variables)

diego amariz

Me aparece primero el alert y hasta darle aceptar no carga lo de la página. ¿que hago?

Israel López

La magia de JavaScript!!

Erna Jungstein

Genial video!
Me pase horas buscando errores en el código porque no me salía el peso,
para darme cuenta después,
que al cerrar, había escrito mal </scirpt>
🤣

Osvaldo Jose Arteaga Villegas

El peso es una fuerza, lo mas correcto seria la masa

juan-crack

Yo utilizo el block de notas xP jejeje

Martín Steven Hernández Ortiz

Queda mas gracioso si en el titulo pones “Como pérder peso MUY RAPIDO”

Carlos Riaño

En Atom no me sale colores en las var, alguien sabe porque?

Gracias

Luis Daniel Altamirano Soto

En atom no me cambia el color de palabras reservadas como var, que se puede hacer?

juan dv

En el video confunde peso con masa.

Marcos Tovar

Gran vídeo, fácil de entender.

Karina Isabel Riquelme Valenzuela

<!DOCTYPE html>
<Html>
<head>
<title>Tu peso en un lugar donde pesas menos</title>
</head>
<body>
<h1>Tu peso en otro planeta</h1>
<p>En la tierra pesas distinto que en Marte o Jupiter</p>
<script>
var g_tierra = 9.8;
var g_marte = 3.7;
var g_Jupiter = 24.8;
var peso = 77;
var peso_final;
peso_final = peso * g_marte / g_tierra;
peso_final = parseInt(peso_final);
document.write(peso_final);
</script>
</body>
</html>

Juddy Tatiana Vargas Santofimio

Interesante

Jaime Alberto Mariño Beaz

oscar hernandez

Oigan peso(se mide en Newton)y masa(se mide en kilogramos) es diferente, el peso en la operación de tu masa total(Kg) multiplicado por la aceleración de la gravedad del lugar donde estés.

EmYi

yo si sabia que la regla de 3 simple tenia un error
like si tambien te diste cuenta XD

Sabino Fernández

Me pasa que con Atom a veces no me reconoce las funciones, tengo que copiar el codigo y abrir un nuevo documento para que me las reconozca, alguien sabe por qué?

Derek Samuel Paúl Peña

Realmente agradezco mucho que en este curso no solo se imparta conocimiento, también experiencia al estudiante al hacer los proyectos. GRACIAS…

federico arroyave ramirez

esto no es una pregunta pero les va a servir a algunas personas
Descarguen visual studio code es mejor que atom
luego descarguen unas cuantas extensiones y sera mucho mejor
(aqui les digo las mejores extensiones : beautify, live server entre otras)

David Leyton Guevara Moyano

Cómo supo que no estaba poniendo atención D:

Rosangélica Marín

<!DOCTYPE html>
<html>
<head>
<title>Tu peso en un lugar donde pesas menos</title>
<style>
body
{
background-color: darkorange;
}
</style>
</head>
<body>
<h1>Tu peso en otro planeta</h1>
<p>En la tierra pesas distinto que en Marte y Jupiter</p>
<script>
var g_tierra = 9.8;
var g_marte = 3.7;
var g_jupiter = 24.8;
var peso = 45;
var peso_final;
peso_final = peso * g_marte / g_tierra;
peso_final = parseInt(peso_final);
document.write(peso_final);
</script>
</body>
</html>

Ghostraccoon

Algo que me causó curiosidad en un principio, fue que freddy no colocó paréntesis en su ecuación, luego recordé las reglas jerárquicas que nos enseñan en la básica “papomudas” y me dí cuenta que no son necesarios en este caso, sin embargo, pienso que como buena práctica deberían colocarse. Aunque, no sé si esto afecte de gran manera en el “procesamiento” que haga la computadora, al ocuparse paréntesis cuando no son necesarios (imaginando siempre un buen trozo de código, donde no sólo sea una ecuación, sino que trabaje con varias, como un juego por ejemplo). si alguien puede responder a esto estaré encantado de leer 😄

Andrea Cabezas

hace un mes

Este es mi aporte😊, trate de que se pudieran ver todos los pesos en los distintos planetas al mismo tiempo

<!DOCTYPE html>
<html>
    <head>
        <title> Tu peso en distintos planetas</title>
        <style type="text/css">
            body
            {
                background-color: rgb(218, 104, 59);
                font-family: Georgia;
                font-size: large;
                color: black;
            }
        </style>
    </head>
    <body>
        <h1>Tu peso puede cambiar en otros planetas!!!🤪</h1>
        <p>En la tierra pesas distinto que en Marte, para ello con <strong> tu peso en la Tierra</strong> podemos descrifrar dichos pesos </p>
        <script type="text/javascript">
            var g_mercurio = 3.7;
            var g_venus = 8.87;
            var g_tierra = 9.8;
            var g_marte = 3.7;
            var g_jupiter = 24.8;
            var g_saturno = 10.44;
  	        var g_urano = 8.7;
 	        var g_neptuno = 11.15;
  	        var g_pluton = 0.62;

            var peso_tierra = prompt("Escribe tu peso en la tierra: ")
            var peso_mercurio = parseInt(peso_tierra*g_mercurio/g_tierra);
            var peso_marte = parseInt(peso_tierra*g_marte/g_tierra);
            var peso_venus = parseInt(peso_tierra*g_venus/g_tierra);
            var peso_jupiter = parseInt(peso_tierra*g_jupiter/g_tierra);
            var peso_saturno = parseInt(peso_tierra*g_saturno/g_tierra);
            var peso_urano = parseInt(peso_tierra*g_urano/g_tierra);
            var peso_neptuno = parseInt(peso_tierra*g_neptuno/g_tierra);
            var peso_pluton = parseInt(peso_tierra*g_pluton/g_tierra);

            document.write("Tu peso en Mercurio es de aproximadamente: " + peso_mercurio + ", ");
            document.write("Tu peso en Venus es de aproximadamente: " + peso_venus + ", ");
            document.write("Tu peso en Marte es de aproximadamente: " + peso_marte + ", ");
            document.write("Tu peso en jupiter es de aproximadamente: " + peso_jupiter + ", ");
            document.write("Tu peso en Saturno es de aproximadamente: " + peso_saturno + ", ");
            document.write("Tu peso en Urano es de aproximadamente: " + peso_urano + ", ");
            document.write("Tu peso en Neptuno es de aproximadamente: " + peso_neptuno + ", ");
            document.write("Tu peso en pluton es de aproximadamente: " + peso_pluton + ", ");
        </script>
    </body>
</html>

Ernceau lorquette

hace 4 meses

que bueno

Maria Sary Libreros

Comparto mi código 😃

Johan Marinissen

Estoy escribiendo el código como Freddy lo instruye, pero de repente los colores de la etiqueta desaparecen en Atom. Solo veo letras grises, ya no con color. Aparece cuando escribo ‘’>" de la etiqueta <script. Después de que ya no veo los colores de todas las etiquetas… Alguien sabe cómo recuperar los colores. Para su aclaración: he descargado el paquete de script en Atom

Kendall Espinoza

estoy asi jaja
listo siguiente video

Ikal Esteban Fernández Galván

Para hacer muy rápido la estructura html hagan esto:
Video

Ares Judda Rivera Soto

hace 9 meses

ejercicio de la clase

Captura de Pantalla 2021-11-14 a la(s) 21.48.50.png

Claudio Alberto Flores Sánchez

Se utilizan mal los terminos masa y peso.

Jose Jose Vergara Villadiego

por si quieren realizar el ejercicio con la gravedad de todos los planetas (incluido la luna), a continuación les dejo las que yo usé:
var g_mercurio = 3.8;
var g_venus = 8.9;
var g_tierra = 9.8;
var g_marte = 3.7;
var g_jupiter = 23.1;
var g_saturno = 9;
var g_urano = 8.6;
var g_neptuno = 11;
var g_pluton = 0.6;
var g_luna = 1.7;

Indira Matute

Opinando por opinar porque esto es totalmente nuevo para mi.

JulioArmandoGH

Katherine

parse_Int
convierte la variables flotantes en variables de tipo entero, de esa manera le quita los decimales

Federico Villa

La formula correcta es (Peso en Tierra/9.8)*gravedad del otro planeta

queda (Kg/m/s2)*m/s2
se van los m/s2 por descarte y el resultado queda en KG, yo lo hice asi desde 0 y quede satisfecho, saludos

Michelearcangelo Salvatore Fontt Oliva

Para los que no les sirva el script deben hacer lo siguiente:

Deben instalar este paquete desde Atom, van a settings y luego a install, en la barra buscan script y presionan el botón Install.
Luego de eso cierran y abren el programa , ¡y problema resuelto!

Antonio José Londoño Cataño

Atom en el video del curso

Atom en mi ordenador

No se por qué en el Atom del curso var, =, los números de gravedad, parseInt; document.write quedan con color y en mi atom no.

¿Alguien me puede explicar como puedo hacer para que salgan con los colores del atom del curso?

Joe Flores

Cunado escribo el <script> me invalida lo demás, osea le quita el color al código que le sigue. Alguna ayuda?

juan esteban carranza alferez

todo iba bien hasta que tuve problemas con </script>, que puedo hacer?

Sebastián Ramírez Schilling

¿Cómo se escribe un salto de linea en document.write("");?

MarianaRestrepoM

Al momento de crear el codigo document.write en la pantalla no me aparece el valor del peso final , sino: peso_final. Que estoy haciendo mal? desde hace rato estoy buscando el video en donde Fredy explicó la manera practicar todo el proceso desde la consola del navegador pero ya no me aparece. Ayuda por favor!!!

Carlos

me funciona pero siempre me sigue saliendo el alert primero que todo el body

Eduardo Gonzalez Garcia

parseInt(nombre de la variable); // sirve para redondear el numero resultante

Yenny Paola Castelblanco Camargo