NodeList

Gli oggetti NodeList sono un insieme di nodi, di solito restituiti da proprietà come Node.childNodes ed il metodo document.querySelectorAll().

Nonostante NodeList non sia un Array, è possibile iterare su esso usando forEach(). Può anche essere convertito in un vero Array usando Array.from().

Tuttavia, alcuni browser meno recenti non hanno implementato NodeList.forEach() né Array.from(). Questo può essere aggirato usando Array.prototype.forEach() — vedi l'esempio di questo documento.

In alcuni casi, la NodeList è dinamica, ciò significa che i cambiamenti nel DOM si riflettono sulla collezione. Per esempio, Node.childNodes è dinamico:

var parent = document.getElementById('parent');
var child_nodes = parent.childNodes;
console.log(child_nodes.length); // assume "2"
parent.appendChild(document.createElement('div'));
console.log(child_nodes.length); // dovrebbe produrre "3"

In altri casi, la NodeList è statica, ciò vuol dire che il contenuto della collezione non è influenzato da quelli nel DOM. document.querySelectorAll() restituisce una NodeList statica.

È bene tenere in mente questa distinzione quando si sceglie di iterare sugli elementi nella NodeList, ed in particolare al modo in cui si salva la lunghezza della lista.

Proprietà

NodeList.length (en-US)
Il numero dei nodi nella NodeList.

Metodi

NodeList.item() (en-US)
Restituisce un elemento nell'elenco per il suo indice, o null se l'indice è fuori misura.
Un'alternativa all'accesso a nodeList[i] (che invece restituisce undefined quando i Ã¨ fuori dai limiti). Ciò è utile soprattutto per le implementazioni DOM di linguaggi non JavaScript.
NodeList.entries() (en-US)
Ritorna un iterator (en-US) che permette al codice di passare attraverso tutte le coppie chiave/valore contenute nella collezione. (In questo caso, le chiavi sono numeri che iniziano da 0 e i valori sono nodi.)
NodeList.forEach()
Esegue una funzione fornita una volta per elemento NodeList passando l'elemento come argomento alla funzione.
NodeList.keys() (en-US)
Ritorna un iterator (en-US) che permette al codice di passare attraverso tutte le chiavi delle coppie chiave/valore contenute nella collezione. (In questo caso, i tasti sono numeri che iniziano da 0).
NodeList.values() (en-US)
Ritorna un iterator (en-US) che permette al codice di passare attraverso tutti i valori (nodi) delle coppie chiave/valore contenute nella collezione.

Esempio

È possibile iterare sugli elementi in una NodeList usando un for loop:

for (var i = 0; i < myNodeList.length; i++) {
  var item = myNodeList[i];  // La chiamata myNodeList.item(i) non è necessaria in JavaScript
}

Non utilizzare for...in o for each...in per enumerare gli elementi nelle NodeList, poiché enumereranno anche le proprietà length e item e causeranno errori se il tuo script presume che debba occuparsi solo di oggetti element. Inoltre, for..in non garantisce la visita delle proprietà in un particolare ordine.

for...of itererà sugli oggetti NodeList correttamente:

var list = document.querySelectorAll( 'input[type=checkbox]' );
for (var item of list) {
  item.checked = true;
}

I browser recenti supportano anche metodi iteratori, forEach(), come entries() (en-US), values() (en-US), e keys() (en-US).

Esiste anche un modo compatibile con Internet Explorer Array.prototype.forEach per l'iterazione.

var list = document.querySelectorAll( 'input[type=checkbox]' );
Array.prototype.forEach.call(list, function (item) {
  item.checked = true;
});

Specifiche

Specifica Stato Commento
DOM
The definition of 'NodeList' in that specification.
Living Standard  
Document Object Model (DOM) Level 3 Core Specification
The definition of 'NodeList' in that specification.
Obsolete  
Document Object Model (DOM) Level 2 Core Specification
The definition of 'NodeList' in that specification.
Obsolete  
Document Object Model (DOM) Level 1 Specification
The definition of 'NodeList' in that specification.
Obsolete

Definizione iniziale.

Compatibilità con i browser

BCD tables only load in the browser