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>Mostrar todos los múltiplos de 3 hasta el número 15</h3>
    <form action="">
        <label for="">número:</label>
        <input type="number" id="numero"><br><br>
        <input type="button" value="Mostrar" onclick="mostrar()">
        <input type="reset" value="Limpiar"><br><br>
        <label for="">resultado:</label><br>
        <textarea name="" id="resultado" cols="30" rows="10"></textarea>
    </form>
    <script>
        function mostrar(){
            let n = parseInt(document.getElementById('numero').value);
            let t = [], a = 1;
            while(a <= n){
                if(a % 3 == 0){
                    t.push(a);
                }
                a++;
            }
            document.getElementById('resultado').value = t;
        }
    </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.
<textarea></textarea> --> define un control de entrada de texto de varias líneas.
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.
while --> el ciclo while recorre un bloque de código siempre que una condición específica sea verdadera.
<= --> el operador menor o igual ( <= ) devuelve true si el operando izquierdo es menor o igual que el operando derecho, y en false caso contrario.
if --> se usa para especificar un bloque de código que se ejecutará, si una condición especificada es verdadera.
.push() --> agrega uno o más elementos al final de un array y devuelve la nueva longitud del array.
== --> el operador de comparacion ( == ) comprueba si sus dos operandos son iguales y devuelve un resultado booleano.
% --> el operador de modulo ( % ) devuelve el resto de la división.
++ --> el operador de incremento ( ++ ) incrementa (suma uno a) su operando y devuelve un valor.
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:

Mostrar todos los múltiplos de 3 hasta el número 15

1. Estructura HTML

La estructura HTML crea la página web donde el usuario puede escribir un número, presionar un botón y visualizar el resultado.

<!DOCTYPE html>

Indica que el documento utiliza HTML5.

Informa que el idioma de la página es español.

<head>

Contiene información de configuración de la página.

Permite mostrar correctamente letras como la ñ y los acentos.

Hace que la página se adapte correctamente a celulares y computadoras.

<title>Ejercicio HTML y JavaScript</title>

Define el título que aparece en la pestaña del navegador.

2. Elementos del formulario

<h3>Mostrar todos los múltiplos de 3 hasta el número 15</h3>

Muestra el título del ejercicio.

Permite ingresar el número hasta donde se buscarán los múltiplos de 3.

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

Limpia los datos del formulario.

Aquí se muestran todos los múltiplos encontrados.

3. Explicación de la función mostrar()

function mostrar(){

Se crea una función llamada mostrar(), que se ejecuta cuando el usuario presiona el botón Mostrar.

let n = parseInt(document.getElementById('numero').value);

Obtiene el número escrito por el usuario y lo convierte en un número entero para poder realizar operaciones matemáticas.

let t = [], a = 1;

t es un arreglo vacío donde se guardarán los múltiplos de 3.
a es un contador que comienza en 1.

while(a <= n){

El ciclo while repite el proceso mientras el contador sea menor o igual al número ingresado.

if(a % 3 == 0){

Comprueba si el número actual es múltiplo de 3.

El operador % calcula el residuo de una división.

Si el residuo es 0, significa que el número es múltiplo de 3.
Si el residuo es diferente de 0, no es múltiplo de 3.

Ejemplos:

3 % 3 = 0 ✔
6 % 3 = 0 ✔
9 % 3 = 0 ✔
10 % 3 = 1 ✘
14 % 3 = 2 ✘
15 % 3 = 0 ✔

t.push(a);

Guarda el múltiplo encontrado dentro del arreglo t.

a++;

Incrementa el contador en una unidad para continuar revisando el siguiente número.

document.getElementById('resultado').value = t;

Muestra todos los múltiplos almacenados en el área de texto.

4. Ejemplo de ejecución

Si el usuario escribe:

El programa revisará los números del 1 al 15.

Los múltiplos de 3 encontrados son:

3,6,9,12,15

Ese resultado aparecerá dentro del cuadro de texto.

5. Resumen

El usuario escribe un número.
JavaScript lo guarda en la variable n.
El ciclo while recorre todos los números desde 1 hasta ese número.
Con el operador % verifica cuáles son múltiplos de 3.
Los múltiplos encontrados se almacenan en un arreglo.
Finalmente, el arreglo se muestra en el área de texto.

Ejercicios de programación

Páginas

sábado, 27 de junio de 2026

Mostrar todos los múltiplos de 3 hasta el número 15 en HTML y JavaScript