Hola estimados compañeros y compañeras, espero que les esté yendo muy bien.
A continuación comparto mi actividad, les agradezco el haber abierto mi post y si gustan dejar alguna observación, comentario o sugerencia ésta será bienvenida.
En la primer alternativa la hice pensando en una pequeña historia para darle un poquito de contexto, me sirve para practicar el uso de etiquetas y así, con un poquito de tiempo extra le quiero agregar entradas del teclado para que el usuario especifique la cantidad de litros del tanque y kilometros recorridos por cada combustible, algo así como una pequeñita caluladora de rendimiento. Y finalmente cuando ya sepa utilizar mejor el HTML y CSS3 darle un estilo mucho mejor. Siento que le tomé cariño por ser mi primer programa con JAVASCRIPT.
La segunda y tercera alternativas ya son un poco rebuscadas nada más para ver que tanto podría reducir el código, obviamente la mantenibilidad no es un objetivo de las mismas.
Saludos!
PRIMERA OPCIÓN
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cálculo de consumo</title>
</head>
<body>
<center>
<h2>¿Cuál es el mejor combustible..?</h2>
<h3>¿Alcohol o Gasolina?</h3>
</center>
<h3>Hola vecino buenos días!, ¿podrías ayudarme a decidir cúal es el mejor combustible para mi auto?, ayer acudí a la sucursal de Autozone y me ofrecieron Alcohol como alternativa.</h3>
<h3>Debo decir que el tanque de mi vehículo tiene una capacidad de 40 litros.</h3>
<center><img src="/BEGINNER_PROGRAMMER/PROGRAMMING_LOGIC_ONE/U3_USING_VARIABLES/img/01_jetta.jpg" alt="Mi vehículo."></center>
<br>
<script>
var capaTanque = 40;//Capacidad en litros del tanque del vehículo.
var rendiGas = 480/capaTanque;//Fórmula de rendimiento km recorridos/litros gastados.
var rendiAlcohol = 300/capaTanque;//Fórmula de rendimiento km recorridos/litros gastados.
document.write("<h3>Cuando cargo el tanque completamente con Gasolina normalmente dura 480 km de recorrido.</h3>");
document.write('<center><img src="/BEGINNER_PROGRAMMER/PROGRAMMING_LOGIC_ONE/U3_USING_VARIABLES/img/02_gasolina.jpg" alt="Gasolina" width="450" height"450"></center>')
document.write("<br>");
document.write("<center><h3>Entonces el rendimiento es de: " + rendiGas + " kilómetros recorridos por cada litro de gasolina.</h3></center>");
document.write("<br>");
document.write("<h3>Me ofrecen Alcohol, es decir Etanol y dicen que es una buena alternativa. ¿Qué te parece?</h3>");
document.write('<center><img src="/BEGINNER_PROGRAMMER/PROGRAMMING_LOGIC_ONE/U3_USING_VARIABLES/img/03_alcohol.jpg" alt="Gasolina" width="450" height"450"></center>')
document.write("<br>");
document.write("<center><h3>Con tanque lleno, el rendimiento fue de: " + rendiAlcohol + " kilómetros recorridos por cada litro de alcohol.</h3></center>");
</script>
<h3>CONCLUSIÓN DEL VECINO</h3>
<h4>PROS</h4>
<ol>
<li>La gasolina tiene mayor rendimiento km/l.</li>
<li>Mayor potencia en el vehículo</li>
</ol>
<h4>CONTRAS</h4>
<ol>
<li>El precio de la gasolina es mayor al del alcohol.</li>
</ol>
</body>
</html>SEGUNDA OPCIÓN
Aquí pongo una versión muuuy reducida del código, muestra el resultado esperado.
<meta charset="UTF-8">
<h3>¿Alcohol o Gasolina?</h3>
<script>
var capaTanque = 40;//Capacidad en litros del tanque del vehículo.
var rendiGas = 480/capaTanque;//Fórmula de rendimiento km recorridos/litros gastados.
var rendiAlcohol = 300/capaTanque;//Fórmula de rendimiento km recorridos/litros gastados.
document.write("<h3>El rendimiento en GASOLINA es de: " + rendiGas + " km/l, en ALCOHOL el rendimiento es de: " + rendiAlcohol + "km/l</h3>");
</script>TERCERA OPCIÓN
Y esta sería como la exagerada digamos, le dejé una variable llamada capaTanque, aunque el cálculo se podría realizar completamente en la línea del document.write
<meta charset="UTF-8">
<h3>¿Alcohol o Gasolina?</h3>
<script>
var capaTanque = 40;//Capacidad en litros del tanque del vehículo.
document.write("<h3>El rendimiento en GASOLINA es de: " + 480/capaTanque + " km/l, en ALCOHOL el rendimiento es de: " + 300/capaTanque + "km/l</h3>");
</script>
