HTML DOM getElementsByTagName()- methode
❮Het Element-ObjectVoorbeeld
Wijzig de HTML-inhoud van het eerste <li>-element (index 0) in een lijst:
var list = document.getElementsByTagName("UL")[0];
list.getElementsByTagName("LI")[0].innerHTML = "Milk";
Definitie en gebruik
De methode getElementsByTagName() retourneert een verzameling van de onderliggende elementen van een element met de opgegeven tagnaam, als een NodeList-object.
Het NodeList-object vertegenwoordigt een verzameling knooppunten. De knooppunten zijn toegankelijk via indexnummers. De index begint bij 0.
Tip: U kunt de eigenschap length van het NodeList-object gebruiken om het aantal onderliggende knooppunten met de opgegeven tagnaam te bepalen, waarna u door alle knooppunten kunt lopen en de gewenste informatie kunt extraheren.
Tip: De parameterwaarde "*" retourneert alle onderliggende elementen van het element.
Browserondersteuning
De cijfers in de tabel geven de eerste browserversie aan die de methode volledig ondersteunt.
| Method | |||||
|---|---|---|---|---|---|
| getElementsByTagName() | 1.0 | 6.0 | 3.0 | 3.0 | 9.5 |
Syntaxis
element.getElementsByTagName(tagname)
Parameterwaarden
| Parameter | Type | Description |
|---|---|---|
| tagname | String | Required. The tagname of the child elements you want to get |
Technische details
| DOM-versie | Kernniveau 1 Element Object |
|---|---|
| Winstwaarde: | Een NodeList-object, dat een verzameling van de onderliggende elementen van het element met de opgegeven tagnaam vertegenwoordigt. De elementen in de geretourneerde collectie worden gesorteerd zoals ze in de broncode voorkomen. |
Meer voorbeelden
Voorbeeld
Zoek uit hoeveel <p>-elementen er in een <div>-element zitten (met behulp van de eigenschap length van het NodeList-object):
var x =
document.getElementById("myDIV").getElementsByTagName("P").length;
Voorbeeld
Verander de achtergrondkleur van het tweede <p> element (index 1) binnen een <div> element:
var x =
document.getElementById("myDIV");
x.getElementsByTagName("P")[1].style.backgroundColor = "red";
Voorbeeld
Verander de achtergrondkleur van alle <p> elementen binnen een <div> element:
var x = document.getElementById("myDIV");
var y = x.getElementsByTagName("P");
var i;
for (i = 0; i < y.length; i++) {
y[i].style.backgroundColor = "red";
}
Voorbeeld
Verander de achtergrondkleur van het vierde element (index 3) binnen een <div> element:
var x = document.getElementById("myDIV");
x.getElementsByTagName("*")[3].style.backgroundColor = "red";
Voorbeeld
De parameter "*" gebruiken.
Verander de achtergrondkleur van alle elementen binnen een <div> element:
var x = document.getElementById("myDIV");
var y = x.getElementsByTagName("*");
var i;
for (i = 0; i < y.length; i++) {
y[i].style.backgroundColor = "red";
}
Gerelateerde pagina's
JavaScript-referentie: document.getElementsByTagName()
JavaScript-zelfstudie: JavaScript HTML DOM-knooppuntlijst
❮Het Element-Object