JavaScript/DOM/Document

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Das Document-Objekt bezieht sich auf den Inhalt, der in einem Browser-Fenster angezeigt wird. Der Browser erzeugt beim Laden des Inhalts genau ein Document-Objekt und stellt es in einer Eigenschaft namens document des globalen Window-Objekts zur Verfügung.

1: Aus dem ParentNode-Mixin
2: Ergänzung aus der HTML Spezifikation
3: Obsolet - nicht verwenden

Verwendung

Im Document Object Model (DOM) des W3-Konsortiums ist das Document-Objekt das Ausgangsobjekt für den Elementbaum. Die Elemente eines HTML-Dokuments stellen dem DOM zufolge also Unterobjekte des Document-Objekts dar. Die einzelnen HTML-Elemente können dabei eigene Eigenschaften und Methoden haben. Diese werden im Abschnitt über HTML-Elementobjekte beschrieben.

Zugriff mit DOM-Methoden

Um ein bestimmtes Element oder eine Liste von Elementen (NodeList) zu ermitteln, stellt das Dokumentobjekt einige zentrale Methoden zur Verfügung:

  • getElementById(): findet das Element, dessen id-Attribut den angegeben Wert hat. Falls es regelwidrig mehrere Elemente mit dieser id gibt, wird das erste davon zurückgegeben.
  • getElementsByName(): findet alle Elemente, die ein name-Attribut mit dem angegebenen Wert besitzen. Das name-Atttribut muss nicht eindeutig sein, deshalb erhalten Sie als Ergebnis eine NodeList.
  • getElementsByTagName(): findet alle Elemente, deren Tag den angegebenen Namen hat. Das Ergebnis ist aber keine NodeList, sondern aus historischen Gründen eine HTMLCollection.
  • querySelector(): gibt das erste Element zurück, das dem angegebenen CSS-Selektor entspricht.
  • querySelectorAll(): gibt eine NodeList mit allen Elementen zurück, die dem angegebenen CSS-Selektor (auch mehrere, durch Komma getrennte, Angaben möglich) entsprechen

Weblinks