Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprenda Desafio: Consultar e Selecionar Elementos do DOM | Manipulação do DOM para Desenvolvimento Web Interativo
Domínio Avançado de JavaScript

bookDesafio: Consultar e Selecionar Elementos do DOM

Tarefa

Você possui uma lista de compras em seu HTML e precisa selecionar elementos específicos utilizando vários métodos de consulta do DOM.

  1. Selecionar por ID: Selecionar o elemento <h1> com o ID title;
  2. Selecionar por Classe: Selecionar todos os elementos com a classe item;
  3. Selecionar por Tag: Selecionar todos os elementos <li>;
  4. Selecionar o Primeiro Elemento Correspondente: Selecionar o primeiro elemento <li> com a classe item;
  5. Selecionar Todos os Elementos Correspondentes: Selecionar todos os elementos <li> com a classe item.
index.html

index.html

index.css

index.css

index.js

index.js

copy
  • Utilizar getElementById para selecionar o elemento <h1> com o ID title;
  • Utilizar getElementsByClassName para selecionar todos os elementos com a classe item;
  • Utilizar getElementsByTagName para selecionar todos os elementos <li>;
  • Utilizar querySelector para selecionar o primeiro elemento <li> com a classe item;
  • Utilizar querySelectorAll para selecionar todos os elementos <li> com a classe item.
index.html

index.html

index.css

index.css

index.js

index.js

copy

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 2. Capítulo 3

Pergunte à IA

expand

Pergunte à IA

ChatGPT

Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo

Awesome!

Completion rate improved to 2.22

bookDesafio: Consultar e Selecionar Elementos do DOM

Deslize para mostrar o menu

Tarefa

Você possui uma lista de compras em seu HTML e precisa selecionar elementos específicos utilizando vários métodos de consulta do DOM.

  1. Selecionar por ID: Selecionar o elemento <h1> com o ID title;
  2. Selecionar por Classe: Selecionar todos os elementos com a classe item;
  3. Selecionar por Tag: Selecionar todos os elementos <li>;
  4. Selecionar o Primeiro Elemento Correspondente: Selecionar o primeiro elemento <li> com a classe item;
  5. Selecionar Todos os Elementos Correspondentes: Selecionar todos os elementos <li> com a classe item.
index.html

index.html

index.css

index.css

index.js

index.js

copy
  • Utilizar getElementById para selecionar o elemento <h1> com o ID title;
  • Utilizar getElementsByClassName para selecionar todos os elementos com a classe item;
  • Utilizar getElementsByTagName para selecionar todos os elementos <li>;
  • Utilizar querySelector para selecionar o primeiro elemento <li> com a classe item;
  • Utilizar querySelectorAll para selecionar todos os elementos <li> com a classe item.
index.html

index.html

index.css

index.css

index.js

index.js

copy

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 2. Capítulo 3
some-alt