HTML DOM Element kinderen
Het Element-objectVoorbeeld
Krijg een verzameling van de kinderen van het <body>-element:
const collection = document.body.children;
Hieronder meer voorbeelden.
Definitie en gebruik
De children
eigenschap retourneert een verzameling van de onderliggende elementen van een element.
De children
eigenschap retourneert een HTMLCollection-object.
Een verschil
De childNodes
eigenschap retourneert alle onderliggende knooppunten , inclusief tekstknooppunten en commentaarknooppunten, terwijl de children
eigenschap alleen de onderliggende elementen retourneert .
Zie ook:
HTMLCollection
Een HTMLCollection is een verzameling HTML-knooppunten.
Knooppunten in een verzameling zijn toegankelijk via indexnummers. De index begint bij 0.
De eigenschap length retourneert het aantal elementen in de verzameling.
Syntaxis
element.children
Winstwaarde
Type | Beschrijving |
Object | Een HTMLCollection-object. De verzameling elementknooppunten. De elementen worden gesorteerd zoals ze in het document worden weergegeven. |
Meer voorbeelden
Ontdek hoeveel kinderen een <div>-element heeft:
var c =
document.getElementById("myDIV").children.length;
Verander de achtergrondkleur van het tweede onderliggende element van een <div> element:
var c = document.getElementById("myDIV").children;
c[1].style.backgroundColor = "yellow";
Haal de tekst op van het derde onderliggende element (index 2) van een <select> element:
var c = document.getElementById("mySelect").children[2].text;
Loop door alle kinderen van <body> en verander hun achtergrondkleur in rood:
var c = document.body.children;
var i;
for (i = 0; i < c.length; i++) {
c[i].style.backgroundColor = "red";
}
Gerelateerde pagina's
HTML DOM-referentie: childNodes-eigenschap
Browserondersteuning
element.children
is een DOM Level 1 (1998)-functie.
Het wordt volledig ondersteund in alle browsers:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | 9-11 | Yes | Yes | Yes | Yes |
Het Element-object