Profe Johnny
Ejercicios · Grupo 5 de 6

DOM y eventos

Selecciona elementos y reacciona a interacciones (usa el panel de salida/consola). Intenta resolver cada ejercicio en el editor antes de revelar la solución.

1 Ejercicio 1 Básico

Selecciona un elemento con querySelector y muestra su texto en consola.

ejercicio-1
Ver solución sugerida
solución 1
2 Ejercicio 2 Básico

Escribe el código para cambiar el texto de un elemento con textContent.

ejercicio-2
Ver solución sugerida
solución 2
3 Ejercicio 3 Básico

Escribe el código para agregar una clase CSS con classList.add().

ejercicio-3
Ver solución sugerida
solución 3
4 Ejercicio 4 Intermedio

Escribe un addEventListener para el evento click de un botón.

ejercicio-4
Ver solución sugerida
solución 4
5 Ejercicio 5 Intermedio

Escribe el código para cambiar el estilo de fondo de un elemento con JS.

ejercicio-5
Ver solución sugerida
solución 5
6 Ejercicio 6 Avanzado

Escribe una función manejadora de evento que use event.target para saber qué se clickeó.

ejercicio-6
Ver solución sugerida
solución 6
7 Ejercicio 7 Avanzado

Escribe el código para crear un elemento <li> nuevo y agregarlo a una lista.

ejercicio-7
Ver solución sugerida
solución 7
8 Ejercicio 8 Intermedio

Escribe el código para alternar una clase (mostrar/ocultar) con classList.toggle().

ejercicio-8
Ver solución sugerida
solución 8
9 Ejercicio 9 Avanzado

Escribe el código para escuchar el evento input de un campo de texto y mostrar lo escrito.

ejercicio-9
Ver solución sugerida
solución 9
10 Ejercicio 10 Avanzado

Describe con código los pasos para mostrar/ocultar un elemento al hacer clic en un botón.

ejercicio-10
Ver solución sugerida
solución 10