HTML-DOM getElementsByClassName () -Methode

Zurück: HTML DOM getElementsByClassName () -Methode

Next: HTML - DOM - Eigenschaft classlist

Beispiele

Ändern Sie die Liste class = "Beispiel" in der class = "Kind" des ersten Elements (Indexwert 0) des Textes:

var list = document.getElementsByClassName ( "Beispiel" ) [0];
list.getElementsByClassName ( "Kind") [0 ] .innerHTML = "Milk";

Ändern Sie den Text vor:

Kaffee
Tee

Nach dem Ändern Sie den Text:

Milch
Tee

Versuchen »

Definitionen und Verwendung

getElementsByClassName () Methode gibt alle Elemente in dem Dokument den Klassennamen der Sammlung angeben, wie NodeList Objekt.

NodeList Objekt stellt eine Knotenliste um. NodeList Objekt wir die Liste der Knoten (ab 0 Indexnummer) durch die Knotenliste des Knotens Indexnummer zugreifen können.

Tipp: Sie können das die NodeList Objekt Länge Eigenschaft , um die Anzahl der Elemente von Klassennamen zu bestimmen und die verschiedenen Elemente des Zyklus der Elemente , die Sie brauchen.

Browser-Unterstützung

Die Zahlen in der Tabelle stellen die erste Browser die Methode Versionsnummer zu unterstützen.

Weg
getElementsByClassName ()	4.0	9.0	3.0	3.1	9.5

Grammatik

Element .getElementsByClassName (classname)

Parameter Wert

Parameter	Typ	Beschreibung
classname	Schnur	Muss. Elementklassen müssen Sie den Namen zu erhalten. Mehrere Klassennamen durch Leerzeichen getrennt, wie "Test-Demo".

Technische Beschreibung

DOM-Version:	Core Level 1 Element Object
Rückgabewert:	NodeList Objekt, das das Element darstellt, gibt den Klassennamen der Sammlung. Die Reihenfolge der Elemente in der Sammlung ihrer Art in der Reihenfolge ihres Auftretens im Code.

Weitere Beispiele

Beispiele

Ändern <div> Element in der zweiten Klasse = "Kind" Elemente der Hintergrundfarbe:

var x = document.getElementById ( "myDiv" );
x.getElementsByClassName ( "Kind") [1 ] .style.backgroundColor = "red";

Versuchen »

Beispiele

Siehe <div> Element in der Anzahl der class = "Kind" Elemente (mit NodeList die Eigenschaft length) sind:

var x = document.getElementById ( "myDiv" ) .getElementsByClassName ( "Kind") .length;

x Der Ausgang ist:

Versuchen »

Beispiele

Ändern class = "Beispiel" Elemente in der ersten Klasse mit dem Namen Hintergrundfarbe "Kind" und "Farbe" Element:

var x = document.getElementsByClassName ( "example" ) [1];
x.getElementsByClassName ( "Kind Farbe") [ 0] .style.backgroundColor = "red";

Versuchen »

Beispiele

Ändern <div> Element class = "Kind" aller Elemente des Hintergrundfarbe:

var x = document.getElementById ( "myDiv" );
var y = x.getElementsByClassName ( "Kind" );
var i;
for (i = 0; i < y.length; i ++) {
y [i] .style.backgroundColor = "red ";
}

Versuchen »