0

Soy un "programador" principiante y estoy intentando hacer funcionar un código que he simplificado para que se entienda de mejor manera. Si alguien puede ayudarme con esto lo agradecería mucho ya que no logro entender porqué no funciona. El código es el siguiente:

let boton = document.getElementById('boton');

    function mensaje(){
     console.log('Este es el mensaje');
    }



    boton.addEventListener('click', mensaje);
<!DOCTYPE html>
<html lang="en">
<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>Mostrar mensaje</title>
    <link rel="stylesheet" href="estilos.css">
    <script type="text/javascript" src="script.js"></script>
    <script src="https://kit.fontawesome.com/3151931480.js" crossorigin="anonymous"></script>
</head>
<body>

    <button class="boton" id="boton">mensaje</button>
    
</body>
</html>

5
  • Y si tienes abierto el developer tools?.
    – loki
    Commented el 5 feb. 2022 a las 5:35
  • Por que dices que no funciona, te aparece algun error? Al ejecutar el codigo compartes, funciona bien. console.log() solo imprime texto en los dev tools. Intenta usar alert() y veras que tu codigo funciona bien.
    – Isaac
    Commented el 5 feb. 2022 a las 5:44
  • Esto funciona. Por qué dices que no?
    – Arriel
    Commented el 5 feb. 2022 a las 5:54
  • 1
    Chequea en inspección, consola.. En principio parecería estar todo bien, suponiendo que el script este en el mismo nivel o ruta que el html... Si es así asegúrate de que el nombre sea correcto, a nivel de código estaría ok, después los script generalmente se ponen dentro del body, justo antes de la etiqueta de cierre, pero depende del órden que desees. Commented el 5 feb. 2022 a las 6:28
  • ¿Cuál es el resultado esperado, y cuál es el obtenido?
    – padaleiana
    Commented el 5 feb. 2022 a las 12:33

1 respuesta 1

0

El script está bien.

Lo que tienes es el típico problema del lugar en que colocas el script. Sucede que el HTML se lee línea a línea de principio a fin.

Al ubicar el script dentro del head, el body aún no está cargado y por lo tanto cuando se ejecuta no encuentra el elemento indicado.

Es recomendable que los scripts que necesiten interactuar con el body se sitúen al final, antes de cerrar el body.

<body>
    ...
    <script type="text/javascript" src="script.js"></script>
</body>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.