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

Espero recibir su retroalimentación gracias:

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="funcionClick();" class="button">Console</button>
        <button onclick="funcionClickJs();" class="button">Alert</button>
        <button onclick="funcionCiudad();" class="button">Prompt</button>
        <button onclick="funcionSuma();" 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 funcionClick (){
    alert ( "El botón fue clicado");
}

function funcionCiudad(){
    ciudad = prompt ("Ingresa el nombre de una ciudad de Brazil: ");
    alert (`Estuve en ${ciudad} y me acordé de ti`);
}

function funcionClickJs (){
    alert ( "Yo amo JS");
}

function funcionSuma(){
    let num1 = parseFloat(prompt("Ingresa el primer número "));
    let num2 = parseFloat(prompt("Ingresa el segundo número "));
    let suma = num1 + num2; 
    console.log (suma);
    alert(`La suma de ${num1} y de ${num2} es ${suma}`);
}
1 respuesta

¡Hola Jireh!

Gracias por compartir tu código. Parece que estás trabajando en un proyecto que utiliza HTML y JavaScript para interactuar con el usuario a través de botones. Todo parece estar bien estructurado, y cada función parece tener un propósito claro. Aquí hay algunas observaciones y sugerencias que podrían ayudarte:

  1. HTML:

    • Tu estructura HTML está bien organizada. Asegúrate de que los archivos style.css y app.js estén en el mismo directorio que tu archivo HTML, o ajusta las rutas si están en otra ubicación.
  2. JavaScript:

    • Veo que estás utilizando querySelector para seleccionar el elemento <h1> y cambiar su contenido. Esto es una buena práctica para manipular el DOM.
    • Las funciones funcionClick, funcionCiudad, funcionClickJs, y funcionSuma están bien definidas y cada una realiza la tarea que describes en los botones.
    • En la función funcionCiudad, asegúrate de declarar la variable ciudad usando let o const para evitar problemas de alcance de variables. Por ejemplo:
      let ciudad = prompt("Ingresa el nombre de una ciudad de Brazil: ");
      
    • En la función funcionSuma, estás utilizando parseFloat para convertir las entradas del usuario en números, lo cual es correcto para permitir decimales. Si solo necesitas números enteros, podrías considerar usar parseInt.
  3. Mejoras adicionales:

    • Considera manejar casos en los que el usuario no ingrese un valor o cancele el prompt. Puedes agregar una verificación simple para asegurar que num1 y num2 sean números válidos antes de proceder con la suma.
    • Para mejorar la experiencia del usuario, podrías estilizar los botones usando CSS en tu archivo style.css.

Espero que estas sugerencias te sean útiles y te ayuden a mejorar tu proyecto.