Collezioni JavaScript H TML DOM
L'oggetto HTMLCollection
Il getElementsByTagName()
metodo restituisce un HTMLCollection
oggetto.
Un HTMLCollection
oggetto è un elenco (raccolta) simile a un array di elementi HTML.
Il codice seguente seleziona tutti <p>
gli elementi in un documento:
Esempio
const myCollection = document.getElementsByTagName("p");
È possibile accedere agli elementi della raccolta tramite un numero di indice.
Per accedere al secondo elemento <p> puoi scrivere:
myCollection[1]
Nota: l'indice inizia da 0.
HTML HTML Lunghezza della raccolta
La length
proprietà definisce il numero di elementi in un HTMLCollection
:
Esempio
myCollection.length
La length
proprietà è utile quando si desidera scorrere gli elementi in una raccolta:
Esempio
Cambia il colore del testo di tutti gli elementi <p>:
const myCollection = document.getElementsByTagName("p");
for (let i = 0; i < myCollection.length; i++) {
myCollection[i].style.color = "red";
}
Una HTMLCollection NON è un array!
Una HTMLCollection può sembrare un array, ma non lo è.
Puoi scorrere l'elenco e fare riferimento agli elementi con un numero (proprio come un array).
Tuttavia, non è possibile utilizzare metodi array come valueOf(), pop(), push() o join() su una HTMLCollection.