Beispiel
Ändern Sie den HTML - Inhalt des ersten <li> Element (index 0) in einer Liste:
var list = document.getElementsByTagName("UL")[0];
list.getElementsByTagName("LI")[0].innerHTML = "Milk";
Bevor Sie den Text ändern:
- Coffee
- Tea
Nach dem Ändern des Textes:
- Milk
- Tea
Versuch es selber " Definition und Verwendung
Die getElementsByTagName() Methode gibt eine Auflistung ein untergeordnetes Element der Elemente mit dem angegebenen Tag - Namen, als NodeList Objekt.
Das NodeList Objekt stellt eine Sammlung von Knoten. Die Knoten können durch Indexnummern zugegriffen werden. Der Index beginnt bei 0.
Tipp: Sie können die Verwendung Länge Eigenschaft des NodeList Objekt die Anzahl der untergeordneten Knoten mit dem angegebenen Tag - Namen , um zu bestimmen, dann können Sie eine Schleife durch alle Knoten und extrahieren Sie die Informationen , die Sie wollen.
Tipp: Die parameter "*" liefert alle untergeordneten Elemente des Elements.
Browser-Unterstützung
Die Zahlen in der Tabelle gibt die erste Browser-Version, die das Verfahren vollständig unterstützt.
| Methode | |||||
|---|---|---|---|---|---|
| getElementsByTagName() | 1.0 | 6.0 | 3.0 | 3.0 | 9.5 |
Syntax
element .getElementsByTagName( tagname )Parameterwerte
| Parameter | Art | Beschreibung |
|---|---|---|
| tagname | String | Erforderlich. Der Tag-Name der untergeordneten Elemente Sie erhalten möchten |
Technische Details
| DOM Version | Core Level 1 Element Object |
|---|---|
| Rückgabewert: | Ein NodeList Objekt, repräsentiert eine Sammlung des Kind-Elemente des Elements mit dem angegebenen Tag-Namen. Die Elemente in der zurückgegebenen Auflistung sortiert werden, wie sie im Quelltext angezeigt. |
Mehr Beispiele
Beispiel
Finden Sie heraus , wie viele <p> Elemente gibt es in einem <div> Elemente (die Länge Eigenschaft des NodeList - Objekts):
var x =
document.getElementById("myDIV").getElementsByTagName("P").length;Das Ergebnis von x wird sein:
3 Versuch es selber " Beispiel
Ändern Sie die Hintergrundfarbe des zweiten <p> Element (index 1) innerhalb eines <div> Element:
var x =
document.getElementById("myDIV");
x.getElementsByTagName("P")[1].style.backgroundColor
= "red"; Versuch es selber " Beispiel
Ändern Sie die Hintergrundfarbe aller <p> Elemente innerhalb eines <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";
} Versuch es selber " Beispiel
Ändern Sie die Hintergrundfarbe des vierten Elements (index 3) innerhalb eines <div> Element:
var x = document.getElementById("myDIV");
x.getElementsByTagName("*")[3].style.backgroundColor = "red"; Versuch es selber " Beispiel
Mit Hilfe der "*" Parameter.
Ändern Sie die Hintergrundfarbe aller Elemente innerhalb eines <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";
} Versuch es selber " Verwandte Seiten
JavaScript Referenz: Dokument. getElementsByTagName()
JavaScript Tutorial: JavaScript HTML DOM Node List