Código del ejercicio:
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.
.push() --> agrega uno o más elementos al final de un array y devuelve la nueva longitud del array.
<= --> el operador menor o igual ( <= ) devuelve true si el operando izquierdo es menor o igual que el operando derecho, y en false caso contrario.
% --> el operador de modulo ( % ) devuelve el resto de la división.
== --> el operador de comparacion ( == ) comprueba si sus dos operandos son iguales y devuelve un resultado booleano.
++ --> 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:
Este programa solicita al usuario un número n. Luego calcula y muestra los n primeros múltiplos de 7. Por ejemplo, si el usuario escribe 5, el programa mostrará:
7, 14, 21, 28, 35
1. Estructura principal del documento
| Código | Explicación |
|---|---|
<!DOCTYPE html> |
Indica que el documento está escrito en HTML5. |
<html> |
Es el elemento principal donde se encuentra todo el contenido de la página. |
<head> |
Contiene información del documento, como el título y la configuración de caracteres. |
<body> |
Contiene todos los elementos que verá el usuario en la página web. |
2. Título del ejercicio
| Código | Explicación |
|---|---|
<h3> |
Muestra el título que explica el objetivo del programa. |
El usuario entiende que el programa mostrará los primeros múltiplos de 7.
3. Formulario
| Código | Función |
|---|---|
<form> |
Agrupa todos los controles del formulario. |
<label> |
Muestra el texto "Número". |
<input type="number"> |
Permite ingresar la cantidad de múltiplos que se desea mostrar. |
<input type="button"> |
Ejecuta la función mostrar(). |
<input type="reset"> |
Limpia el formulario. |
<textarea> |
Presenta el resultado generado por el programa. |
4. Función mostrar()
Toda la lógica del programa se encuentra dentro de esta función.
| Código | Explicación |
|---|---|
let n = parseInt(document.getElementById('numero').value); |
Obtiene el número ingresado por el usuario y lo convierte en un número entero. |
let t = []; |
Crea un arreglo vacío donde se almacenarán los múltiplos encontrados. |
let a = 7; |
La búsqueda comienza desde el número 7. |
let c = 1; |
Es un contador que indica cuántos múltiplos ya fueron encontrados. |
5. Ciclo while
| Código | Explicación |
|---|---|
while(c <= n) |
El ciclo continúa hasta encontrar la cantidad de múltiplos solicitados por el usuario. |
if(a % 7 == 0) |
Comprueba si el número actual es múltiplo de 7 usando el operador módulo (%). |
t.push(a); |
Guarda el múltiplo encontrado dentro del arreglo. |
c++; |
Aumenta el contador porque ya se encontró un nuevo múltiplo. |
a++; |
Pasa al siguiente número para seguir buscando. |
6. Mostrar el resultado
| Código | Explicación |
|---|---|
document.getElementById('resultado').value = t; |
Muestra todos los múltiplos almacenados en el área de texto. |
7. Funcionamiento paso a paso
Si el usuario escribe el número 5, el programa realiza las siguientes acciones:
| Paso | Resultado |
|---|---|
| 1 | Lee el número 5. |
| 2 | Empieza desde el número 7. |
| 3 | Verifica si cada número es múltiplo de 7. |
| 4 | Guarda: 7, 14, 21, 28 y 35. |
| 5 | Cuando encuentra los 5 múltiplos, termina el ciclo. |
| 6 | Los muestra en el área de resultados. |
8. Resumen
Este programa utiliza un ciclo while para recorrer números consecutivos a partir del 7. Cada número se verifica con el operador %. Cuando el residuo de dividir entre 7 es igual a 0, significa que el número es múltiplo de 7 y se guarda en un arreglo. El proceso continúa hasta obtener la cantidad de múltiplos solicitada y finalmente todos ellos se muestran en el cuadro de resultados.