Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprende Desafío: Consultar y Seleccionar Elementos del DOM | Manipulación del DOM para el Desarrollo Web Interactivo
Lógica e Interacción en JavaScript

bookDesafío: Consultar y Seleccionar Elementos del DOM

Tarea

Tienes una lista de compras en tu HTML y necesitas seleccionar elementos específicos utilizando varios métodos de consulta del DOM.

  1. Seleccionar por ID: Seleccionar el elemento <h1> con el ID title;
  2. Seleccionar por clase: Seleccionar todos los elementos con la clase item;
  3. Seleccionar por etiqueta: Seleccionar todos los elementos <li>;
  4. Seleccionar el primer elemento coincidente: Seleccionar el primer elemento <li> con la clase item;
  5. Seleccionar todos los elementos coincidentes: Seleccionar todos los elementos <li> con la clase item.
index.html

index.html

index.css

index.css

index.js

index.js

copy
  • Utilizar getElementById para seleccionar el elemento <h1> con el ID title;
  • Utilizar getElementsByClassName para seleccionar todos los elementos con la clase item;
  • Utilizar getElementsByTagName para seleccionar todos los elementos <li>;
  • Utilizar querySelector para seleccionar el primer elemento <li> con la clase item;
  • Utilizar querySelectorAll para seleccionar todos los elementos <li> con la clase item.
index.html

index.html

index.css

index.css

index.js

index.js

copy

¿Todo estuvo claro?

¿Cómo podemos mejorarlo?

¡Gracias por tus comentarios!

Sección 2. Capítulo 3

Pregunte a AI

expand

Pregunte a AI

ChatGPT

Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla

Awesome!

Completion rate improved to 2.22

bookDesafío: Consultar y Seleccionar Elementos del DOM

Desliza para mostrar el menú

Tarea

Tienes una lista de compras en tu HTML y necesitas seleccionar elementos específicos utilizando varios métodos de consulta del DOM.

  1. Seleccionar por ID: Seleccionar el elemento <h1> con el ID title;
  2. Seleccionar por clase: Seleccionar todos los elementos con la clase item;
  3. Seleccionar por etiqueta: Seleccionar todos los elementos <li>;
  4. Seleccionar el primer elemento coincidente: Seleccionar el primer elemento <li> con la clase item;
  5. Seleccionar todos los elementos coincidentes: Seleccionar todos los elementos <li> con la clase item.
index.html

index.html

index.css

index.css

index.js

index.js

copy
  • Utilizar getElementById para seleccionar el elemento <h1> con el ID title;
  • Utilizar getElementsByClassName para seleccionar todos los elementos con la clase item;
  • Utilizar getElementsByTagName para seleccionar todos los elementos <li>;
  • Utilizar querySelector para seleccionar el primer elemento <li> con la clase item;
  • Utilizar querySelectorAll para seleccionar todos los elementos <li> con la clase item.
index.html

index.html

index.css

index.css

index.js

index.js

copy

¿Todo estuvo claro?

¿Cómo podemos mejorarlo?

¡Gracias por tus comentarios!

Sección 2. Capítulo 3
some-alt