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

[Proyecto] Desafío: hora de practicar

1 Descarga otro proyecto haciendo clic en este enlace y ábrelo en Visual Studio Code.

2 Cambia el contenido de la etiqueta h1 con document.querySelector y asigna el siguiente texto: "Hora del Desafío".

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

3 Crea una función que muestre en la consola el mensaje "El botón fue clicado" siempre que se presione el botón "Console".

Para el HTML

Para el JS function mostarMensajeEnLaConsola() { console.log('El botón fue clicado') }

4 Crea una función que se ejecute cuando se haga clic en el botón "prompt", preguntando el nombre de una ciudad de Brasil. Luego, muestra una alerta con el mensaje concatenando la respuesta con el texto: "Estuve en {ciudad} y me acordé de ti".

Para el HTML

Para el JS function mostrarAlerta() { let ciudad = prompt("Escribe el nombre de una ciudad de Brasil:"); alert("Estuve en " + ciudad + " y me acordé de ti."); }

5 Crea una función que muestre una alerta con el mensaje: "Yo amo JS" siempre que se presione el botón "Alerta".

Para HTML

Para JS function mostrarAlerta(){ alert("YO AMO JS"); }

6 Al hacer clic en el botón "suma", pide 2 números y muestra el resultado de la suma en una alerta.

Para el HTML

Para el JS function sumarDosNumeros(){ let primerNum = parseInt(prompt('Ingresar el primer numero')); let segunNum = parseInt(prompt('Ingresar el segundo numero')); let resultado = primerNum + segunNum; alert('${primerNum} + ${segunNum} = ${resultado}') }

1 respuesta

Hola Lizbeth, espero que estés bien

Parece que estás trabajando en un proyecto interesante. Vamos a revisar cada uno de los pasos que has mencionado para asegurarnos de que todo esté en orden:

  1. Cambiar el contenido de la etiqueta h1:
    Tu código para cambiar el contenido de la etiqueta h1 es correcto. Usaste document.querySelector('h1') para seleccionar el elemento y luego cambiaste el contenido con innerHTML. ¡Perfecto!

    let titulo = document.querySelector('h1');
    titulo.innerHTML = 'Hora del Desafío';
    
  2. Función para mostrar mensaje en la consola:
    La función mostarMensajeEnLaConsola está bien implementada. Solo asegúrate de que el nombre de la función en el HTML coincida exactamente con el nombre en el JS.

    <button onclick="mostarMensajeEnLaConsola()" class="button">Console</button>
    
    function mostarMensajeEnLaConsola() {
        console.log('El botón fue clicado');
    }
    
  3. Función para mostrar una alerta con el nombre de una ciudad:
    Esta parte también está bien. La función mostrarAlerta pide al usuario el nombre de una ciudad y luego muestra una alerta con el mensaje.

    <button onclick="mostrarAlerta()" class="button">Alert</button>
    
    function mostrarAlerta() {
        let ciudad = prompt("Escribe el nombre de una ciudad de Brasil:");
        alert("Estuve en " + ciudad + " y me acordé de ti.");
    }
    
  4. Función para mostrar una alerta con "Yo amo JS":
    Parece que hay un pequeño error aquí. Tienes dos funciones con el mismo nombre mostrarAlerta. Necesitarás cambiar el nombre de una de ellas para evitar conflictos. Por ejemplo, podrías renombrar la función para mostrar "Yo amo JS" a mostrarAlertaAmorJS.

    <button onclick="mostrarAlertaAmorJS()" class="button">Alerta</button>
    
    function mostrarAlertaAmorJS() {
        alert("YO AMO JS");
    }
    
  5. Función para sumar dos números:
    Tu código es casi correcto, pero hay un pequeño error en la forma en que estás concatenando la cadena en la alerta. Deberías usar comillas invertidas (backticks) en lugar de comillas simples para que la interpolación de cadenas funcione correctamente.

    <button onclick="sumarDosNumeros()" class="button">Suma</button>
    
    function sumarDosNumeros() {
        let primerNum = parseInt(prompt('Ingresar el primer número'));
        let segunNum = parseInt(prompt('Ingresar el segundo número'));
        let resultado = primerNum + segunNum;
        alert(`${primerNum} + ${segunNum} = ${resultado}`);
    }
    

Espero que estas sugerencias te sean útiles y te ayuden a completar tu proyecto con éxito. ¡Bons estudios!