Skip to content

Practica 7

Eventos de Javascript

Deadline: Domingo 26 de Noviembre

Hasta ahora, hemos estado trabajando con los eventos que proporciona el navegador llamando a nuestras funciones desde el HTML, pero también podemos asignar eventos directamente desde JavaScript.

Crea un proyecto en tu repositorio de GitHub llamado practica_7 y crea un index.html, añade un script.js y un style.css.

  1. En el html necesitaremos:

    • Un h1 con el texto "Eventos de JavaScript"
    • Un parrafo con el texto "Tenemos tres formas de asignar eventos desde JavaScript:"
    • Un botón con el texto "Evento HTML"
    • Un botón con el texto "addEventListener"
    • Un botón con el texto "Event handler"
    • Un parrafo con el texto "Haz click en los botones para ver el resultado"
  2. Añade un evento al botón "Evento HTML" que edite el parrafo inferior con el texto "Has hecho click en el botón con evento HTML", debes hacerlo utilizando un atributo directamente en el elemento HTML, como hemos hecho hasta ahora en clase

Para los siguientes eventos, necesitarás echar un vistazo a la referencia de eventos y también funciones anónimas

  1. Añade un evento al botón "addEventListener" que edite el parrafo inferior con el texto "Has hecho click en el botón con addEventListener", debes hacerlo utilizando el método addEventListener.
  2. Añade un evento al botón "Event handler" que edite el parrafo inferior con el texto "Has hecho click en el botón con event handler", debes hacerlo utilizando un event handler directamente en js.
  3. Cambia el color de fondo del parrafo inferior en cada una de las diferentes respuestas que puede tomar.
  4. Centra los elementos en la pagina.