Appearance
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
.
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"
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
- 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
. - 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. - Cambia el color de fondo del parrafo inferior en cada una de las diferentes respuestas que puede tomar.
- Centra los elementos en la pagina.