Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

Desafío: hora de practicar

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Document</title>
</head>
<body>
    <header>
        <h1></h1>
    </header>
    <main class="container">
        <button onclick="probarBoton();" class="button">Console</button>
        <button onclick="yoAmo();" class="button">Alert</button>
        <button onclick="ciudad();" class="button">Prompt</button>
        <button onclick="suma();" class="button">Suma</button>
    </main>

      <script src="app.js"></script>
</body>
</html>

JS

let titulo = document.querySelector('h1');
titulo.innerHTML = 'Hora del desafío';

function probarBoton() {
    alert('El botón fue clicado');
}

function ciudad() {
    let nombreCiudad = prompt('Menciona el nombre de una ciudad en Brasil');
    alert(`Estuve en ${nombreCiudad} y me acorde de tí`);
}

function yoAmo(){
    alert('Yo amo JS');
}

function suma() {
    let num1 = parseInt(prompt('Ingresa el primer número'));
    let num2 = parseInt(prompt('Ingresa el segundo número'));
    let resultado = num1 + num2;
    alert(`La suma de ${num1} y ${num2} es: ${resultado}`);
}
1 respuesta

¡Hola Larry!

Parece que estás trabajando en un proyecto de HTML y JavaScript donde estás practicando eventos de botones y funciones. Tu código se ve bastante bien estructurado. Aquí te dejo algunos comentarios y sugerencias para asegurarte de que todo funcione correctamente:

  1. HTML: Tu estructura HTML está bien definida. Tienes un contenedor principal con botones que llaman a diferentes funciones JavaScript cuando son clicados.

  2. JavaScript:

    • La función probarBoton() muestra un mensaje de alerta cuando se hace clic en el botón correspondiente. Esto está funcionando bien.
    • La función ciudad() utiliza prompt para pedir el nombre de una ciudad y luego muestra una alerta con el nombre ingresado. Asegúrate de manejar el caso en que el usuario no ingrese nada o cancele el prompt.
    • La función yoAmo() simplemente muestra una alerta diciendo "Yo amo JS". Esto es correcto.
    • La función suma() pide dos números al usuario, los convierte a enteros usando parseInt, y luego muestra el resultado de su suma. Aquí, sería útil verificar si las entradas son realmente números antes de realizar la suma para evitar errores.

Por ejemplo, podrías mejorar la función suma() de la siguiente manera para manejar entradas no válidas:

function suma() {
    let num1 = parseInt(prompt('Ingresa el primer número'));
    let num2 = parseInt(prompt('Ingresa el segundo número'));

    if (isNaN(num1) || isNaN(num2)) {
        alert('Por favor, ingresa valores numéricos válidos.');
    } else {
        let resultado = num1 + num2;
        alert(`La suma de ${num1} y ${num2} es: ${resultado}`);
    }
}

Esto asegurará que el usuario reciba un mensaje de error si ingresa algo que no es un número.

Espero que estas sugerencias te sean útiles y te ayuden a mejorar tu práctica. ¡Sigue adelante con tus estudios y diviértete programando!

Espero haber ayudado y buenos estudios!