JavaScript/DOM/Document

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.

Unterobjekte

• document
  • all³
  • anchors³
  • body²
  • embeds²
  • forms²
    • elements
      • options
  • head²
  • images²
  • links²
  • plugins²
  • scripts²

Eigenschaften

• characterSet
• children¹
• childElementCount¹
• cookie²
• dir²
• domain²
• defaultCharset
• firstElementChild¹
• getElementsByName²
• lastElementChild¹
• lastModified²
• location²
• readyState²
• referrer²
• title²
• URL

Methoden

• append()¹
• close()
• createAttribute()
• createDocumentFragment()
• createElement()
• createTextNode()
• getElementById()
• getElementsByName()
• getElementsByClassName()
• getElementsByTagName()
• getSelection()
• importNode()
• open()
• prepend()¹
• querySelector()
• querySelectorAll()
• replaceChildren()¹
• write()
• writeln()

XPath-Methoden

• createExpression()
• createNSResolver()
• evaluate()

¹: Aus dem ParentNode-Mixin
²: Ergänzung aus der HTML Spezifikation
³: 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

• W3C: Document Object Model (DOM) Level 1 Specification Recommendation vom 1 October, 1998
• W3C: Document Object Model (DOM) Level 3 Core Specification Recommendation vom 07 April 2004

• MDN: Document