viernes, 19 de junio de 2026

Convertir millas a pies en HTML y JavaScript

Código del ejercicio:

<!DOCTYPE html>
<html lang="es">
<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>Ejercicio HTML y JavaScript</title>
</head>
<body>
    <h3>Convertir millas a pies</h3>
    <form action="">
        <label for="">milla:</label>
        <input type="number" id="milla"><br><br>
        <input type="button" value="Convertir" onclick="convertir()">
        <input type="reset" value="Limpiar"><br><br>
        <label for="">resultado:</label>
        <input type="text" id="resultado">
    </form>
    <script>
        function convertir(){
            let milla = parseFloat(document.getElementById('milla').value);
            let convertir = milla * 5280;
            document.getElementById('resultado').value = `${convertir} ft`;
        }
    </script>
</body>
</html>

Definición de los códigos del ejercicio:

<h3></h3> --> representa un encabezado de nivel 3.
<form></form> --> se utiliza para crear un formulario HTML para la entrada del usuario.
<br> --> produce un salto de línea en el texto.
<label></label> --> representa una etiqueta para un elemento en una interfaz de usuario.
<input> --> etiqueta especifica un campo de entrada donde el usuario puede ingresar datos.
onclick --> onclick evento ocurre cuando el usuario hace clic en un elemento.
<script></script> --> contiene comandos u ordenes que se van ejecutando de manera secuencial y comúnmente se utilizan para controlar el comportamiento de un programa en específico o para interactuar con el sistema operativo.
let --> permite declarar variables limitando su alcance (scope) al bloque, declaración, o expresión donde se está usando.
function --> es un bloque de código diseñado para realizar una tarea en particular.
parseFloat() --> analiza un argumento (si es necesario, lo convierte en una cadena) y devuelve un número de coma flotante.
document.getElementById() --> devuelve un elemento con un valor especificado.
.value --> establece o devuelve el valor del atributo de valor de un campo de texto.
`${}` --> los literales de plantilla (cadenas de plantilla) le permiten utilizar cadenas o expresiones incrustadas en forma de cadena.

Explicación del Código:

Este programa permite convertir una cantidad de millas a pies. El usuario ingresa un valor, presiona el botón Convertir y el sistema muestra automáticamente el resultado.

1. Título del ejercicio

<h3>Convertir millas a pies</h3>

Muestra el nombre del ejercicio en la página web.

2. Campo para ingresar millas

<input type="number" id="milla">

Permite al usuario escribir la cantidad de millas que desea convertir. El atributo id="milla" identifica el campo para que JavaScript pueda obtener su valor.

3. Botón Convertir

<input type="button" value="Convertir" onclick="convertir()">

Cuando el usuario hace clic en este botón, se ejecuta la función convertir().

4. Botón Limpiar

<input type="reset" value="Limpiar">

Borra los datos ingresados en el formulario.

5. Campo de resultado

<input type="text" id="resultado">

Muestra el resultado final de la conversión.

6. Función JavaScript

function convertir(){ let milla = parseFloat(document.getElementById('milla').value); let convertir = milla * 5280; document.getElementById('resultado').value = `${convertir} ft`; }

7. Explicación paso a paso

Paso 1: Obtener el valor ingresado.

let milla = parseFloat(document.getElementById('milla').value);

Se obtiene el valor del campo de texto y se convierte a número decimal mediante parseFloat().

Paso 2: Realizar la conversión.

let convertir = milla * 5280;

Se multiplica la cantidad de millas por 5280, ya que:

1 milla = 5280 pies

Paso 3: Mostrar el resultado.

document.getElementById('resultado').value = `${convertir} ft`;

El resultado se muestra en el cuadro de texto de salida junto con la unidad ft (pies).

8. Ejemplo de ejecución

Si el usuario ingresa:

2 millas

La operación será:

2 × 5280 = 10560

Resultado mostrado:

10560 ft

Resumen

El programa recibe una cantidad de millas, la multiplica por 5280 para convertirla a pies y muestra el resultado automáticamente al presionar el botón Convertir.

No hay comentarios.:

Publicar un comentario

Convertir millas a pies en HTML y JavaScript

Código del ejercicio: <! DOCTYPE html > < html lang = "es" > < head >     < meta charset = ...

Copyright ©2025 Ejercicios de programación. Todos los derechos reservados. ❤️