JavaScript H TML DOM-verzamelingen
Het HTMLCollection-object
De getElementsByTagName()methode retourneert een HTMLCollectionobject.
Een HTMLCollectionobject is een array-achtige lijst (verzameling) van HTML-elementen.
De volgende code selecteert alle <p>elementen in een document:
Voorbeeld
const myCollection = document.getElementsByTagName("p");
De elementen in de collectie zijn toegankelijk via een indexnummer.
Om toegang te krijgen tot het tweede <p> element kun je schrijven:
myCollection[1]
Opmerking: de index begint bij 0.
Lengte HTML HTMLCollection
De lengtheigenschap definieert het aantal elementen in een HTMLCollection:
Voorbeeld
myCollection.length
De lengtheigenschap is handig wanneer u door de elementen in een verzameling wilt bladeren:
Voorbeeld
Wijzig de tekstkleur van alle <p> elementen:
const myCollection = document.getElementsByTagName("p");
for (let i = 0; i < myCollection.length; i++) {
myCollection[i].style.color = "red";
}
Een HTMLCollection is GEEN array!
Een HTMLCollection lijkt misschien op een array, maar is het niet.
U kunt door de lijst lopen en naar de elementen verwijzen met een nummer (net als een array).
U kunt echter geen arraymethoden zoals valueOf(), pop(), push() of join() gebruiken op een HTMLCollection.