Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Impara Sfida: Interrogare e Selezionare Elementi DOM | Manipolazione del DOM per lo Sviluppo Web Interattivo
Padronanza Avanzata di JavaScript

bookSfida: Interrogare e Selezionare Elementi DOM

Compito

Hai una lista della spesa nel tuo HTML e devi selezionare elementi specifici utilizzando diversi metodi di interrogazione del DOM.

  1. Seleziona per ID: Seleziona l'elemento <h1> con l'ID title;
  2. Seleziona per Classe: Seleziona tutti gli elementi con la classe item;
  3. Seleziona per Tag: Seleziona tutti gli elementi <li>;
  4. Seleziona il Primo Elemento Corrispondente: Seleziona il primo elemento <li> con la classe item;
  5. Seleziona Tutti gli Elementi Corrispondenti: Seleziona tutti gli elementi <li> con la classe item.
index.html

index.html

index.css

index.css

index.js

index.js

copy
  • Utilizza getElementById per selezionare l'elemento <h1> con l'ID title;
  • Utilizza getElementsByClassName per selezionare tutti gli elementi con la classe item;
  • Utilizza getElementsByTagName per selezionare tutti gli elementi <li>;
  • Utilizza querySelector per selezionare il primo elemento <li> con la classe item;
  • Utilizza querySelectorAll per selezionare tutti gli elementi <li> con la classe item.
index.html

index.html

index.css

index.css

index.js

index.js

copy

Tutto è chiaro?

Come possiamo migliorarlo?

Grazie per i tuoi commenti!

Sezione 2. Capitolo 3

Chieda ad AI

expand

Chieda ad AI

ChatGPT

Chieda pure quello che desidera o provi una delle domande suggerite per iniziare la nostra conversazione

Suggested prompts:

Can you show me the HTML structure of the shopping list?

Can you provide example code for each selection method?

Can you explain the difference between querySelector and querySelectorAll?

Awesome!

Completion rate improved to 2.22

bookSfida: Interrogare e Selezionare Elementi DOM

Scorri per mostrare il menu

Compito

Hai una lista della spesa nel tuo HTML e devi selezionare elementi specifici utilizzando diversi metodi di interrogazione del DOM.

  1. Seleziona per ID: Seleziona l'elemento <h1> con l'ID title;
  2. Seleziona per Classe: Seleziona tutti gli elementi con la classe item;
  3. Seleziona per Tag: Seleziona tutti gli elementi <li>;
  4. Seleziona il Primo Elemento Corrispondente: Seleziona il primo elemento <li> con la classe item;
  5. Seleziona Tutti gli Elementi Corrispondenti: Seleziona tutti gli elementi <li> con la classe item.
index.html

index.html

index.css

index.css

index.js

index.js

copy
  • Utilizza getElementById per selezionare l'elemento <h1> con l'ID title;
  • Utilizza getElementsByClassName per selezionare tutti gli elementi con la classe item;
  • Utilizza getElementsByTagName per selezionare tutti gli elementi <li>;
  • Utilizza querySelector per selezionare il primo elemento <li> con la classe item;
  • Utilizza querySelectorAll per selezionare tutti gli elementi <li> con la classe item.
index.html

index.html

index.css

index.css

index.js

index.js

copy

Tutto è chiaro?

Come possiamo migliorarlo?

Grazie per i tuoi commenti!

Sezione 2. Capitolo 3
some-alt