JavaScript/DOM/Document/getElementsByClassName

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Die Methode Document.getElementsByClassName() gibt eine Liste von Elementen zurück, die der angegebenen Klasse (auch mehrere, durch Komma getrennte, Angaben möglich) entsprechen. Sie liefert eine sogenannte live node list als Rückgabewert, über die der Zugriff auf die gefundenen Elemente ermöglicht wird.

  • Chrome
  • Firefox
  • IE 9
  • Opera
  • Safari

Syntax

elements = document.getElementsByName(name)

[Bearbeiten] Anwendungsbeispiel

Beispiel ansehen …
function beispielSuchen() {
  var x = document.getElementsByClassName('beispiel');
  for (var i = 0; i < x.length; i++) {
    x[i].innerHTML = 'Beispiel: ' + x[i].innerHTML;
  }
}

Ein Klick auf den Button zeigt an, welche Absätze die Klasse "beispiel" haben.

Beachten Sie: Die Methode getElementsByClassName() regelt lediglich den Zugriff auf HTML-Elemente. Weitere Möglichkeiten, um HTML-Elemente dynamisch zu beeinflussen, bietet das Node-Objekt an.
Beachten Sie, dass getElementsByClassName kein Array zurückgibt, sondern eine sogenannte live node list. Man kann mittels einer Schleife die Elemente auslesen, hat aber nicht die Methoden eines Arrays zur Verfügung. Außerdem verändert sich diese live node list, wenn Sie ein Element aus dem DOM entfernen, da diese Liste eben "live" (sprich: "lebendig") ist.

[Bearbeiten] Siehe auch

[Bearbeiten] Weblinks

Meine Werkzeuge
Namensräume

Varianten
Aktionen
Übersicht
Index
Mitmachen
Werkzeuge
Spenden
SELFHTML