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>Pedir la edad y determinar si puede o no sacar licencia de conducir</h3>
    <form action="">
        <label for="">edad:</label>
        <input type="number" id="edad"><br><br>
        <input type="button" value="Mostrar" onclick="mostrar()">
        <input type="reset" value="Limpiar"><br><br>
        <label for="">resultado:</label>
        <input type="text" id="resultado">
    </form>
    <script>
        function mostrar(){
            let edad = parseInt(document.getElementById('edad').value);
            if(edad >= 18){
                document.getElementById('resultado').value = "Licencia otorgada.";
            }else{
                document.getElementById('resultado').value = "Licencia negada.";
            }
        }
    </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.
function --> es un bloque de código diseñado para realizar una tarea en particular.
let --> permite declarar variables limitando su alcance (scope) al bloque, declaración, o expresión donde se está usando.
parseInt() --> analiza un valor como una cadena y devuelve el primer entero.
if --> se usa para especificar un bloque de código que se ejecutará, si una condición especificada es verdadera.
else --> se usa para especificar un bloque de código a ejecutar, si la misma condición es falsa.
>= --> el operador mayor que o igual ( >= ) devuelve true si el operando izquierdo es mayor o igual que el operando derecho, y en false caso contrario.
document.getElementById() --> devuelve un elemento con un valor especificado.
.value --> establece o devuelve el valor del atributo de valor de un campo de texto.

Explicación del Código:

Este programa solicita al usuario su edad mediante un formulario. Luego, al presionar el botón Mostrar, JavaScript verifica si la persona tiene la edad suficiente para obtener una licencia de conducir. Finalmente, muestra el resultado en una caja de texto.

Explicación de cada parte del código

<!DOCTYPE html>
Indica que el documento utiliza la versión HTML5.
<html lang="es">
Es la etiqueta principal del documento y especifica que el idioma es español.
<head>
Contiene la configuración de la página, como la codificación de caracteres, el diseño adaptable y el título.
<meta charset="UTF-8">
Permite mostrar correctamente letras con acentos, la letra ñ y otros caracteres especiales.
<meta name="viewport">
Hace que la página se adapte correctamente a celulares, tablets y computadoras.
<title>
Define el nombre que aparece en la pestaña del navegador.
<body>
Contiene todo el contenido visible de la página.
<h3>
Muestra el título del ejercicio.
<form>
Agrupa todos los elementos del formulario.
<label>
Muestra el texto "edad:" para indicar qué dato debe ingresar el usuario.
<input type="number" id="edad">
Crea una caja donde el usuario escribe su edad. Solo permite ingresar números.
<input type="button">
Crea el botón Mostrar. Al hacer clic, ejecuta la función mostrar().
<input type="reset">
Crea el botón Limpiar, que borra los datos ingresados en el formulario.
<input type="text" id="resultado">
Es la caja donde se muestra el mensaje indicando si la licencia fue otorgada o negada.

Explicación del código JavaScript

function mostrar()
Declara una función llamada mostrar(), la cual se ejecuta al presionar el botón Mostrar.
let edad = parseInt(document.getElementById('edad').value);
Obtiene el número escrito por el usuario en la caja de texto y lo convierte en un número entero para poder compararlo.
if(edad >= 18)
Comprueba si la edad es mayor o igual a 18 años.
document.getElementById('resultado').value = "Licencia otorgada.";
Si la condición es verdadera, muestra el mensaje "Licencia otorgada.".
else
Se ejecuta cuando la persona tiene menos de 18 años.
document.getElementById('resultado').value = "Licencia negada.";
Muestra el mensaje "Licencia negada." cuando la persona no cumple con la edad mínima.

Funcionamiento del programa

El usuario escribe su edad.
Hace clic en el botón Mostrar.
JavaScript lee la edad ingresada.
Comprueba si la edad es mayor o igual a 18.
Si cumple la condición, muestra "Licencia otorgada.".
Si no cumple la condición, muestra "Licencia negada.".
El botón Limpiar borra todos los datos del formulario.

Resumen

Este ejercicio enseña cómo solicitar un dato al usuario, leerlo con JavaScript, utilizar una estructura condicional if...else para tomar una decisión y mostrar el resultado en un campo del formulario. Es un ejemplo básico del uso de condiciones en HTML y JavaScript.

Ejercicios de programación

Páginas

viernes, 26 de junio de 2026

Pedir la edad y determinar si puede o no sacar licencia de conducir en HTML y JavaScript