DOM

Klippstein IT Service

Aus 4webmaster.de

Wechseln zu: Navigation, Suche

Das Document Object Model (DOM) ist eine objektorientierte API eines XML-Parsers für den Zugriff auf XML-Dokumente.

Beispielsweise kann mit DOM der Quelltext einer Webseite gelesen und geändert werden. Ein Programm, das beispielsweise in JavaScript geschrieben ist und im Browser abläuft, kann über DOM den Inhalt, die Struktur und das Layout der Webseite dynamisch ändern. Das wird z.B. von Ajax verwendet.

DOM wird vom W3C definiert. Die ersten DOM-Standards des W3C stellen daher den Versuch dar, die verschiedenen proprietären JavaScript- und DHTML-Techniken, die während der Zeit der Browserkriege entstanden, zusammenzuführen, zu standardisieren und letztlich abzulösen. Dies ist gelungen, so dass DOM heutzutage eine zentrale Bedeutung bei der JavaScript-Programmierung einnimmt.

Grundlagen des DOM anhand eines Beispiels

Der HTML-Code links definiert eine Tabelle mit dem Element table und verschiedenen Unterelementen. Das DOM repräsentiert das table-Element und dessen Unterelemente als Baumstruktur, wie sie rechts dargestellt ist.

<table>
 
   <thead>
     <tr>
       <th>Vorname</th>
       <th>Nachname</th>
     </tr>
   </thead>
 
   <tbody>
     <tr>
       <td>Donald</td>
       <td>Duck</td>
     </tr>
   </tbody>
 
 </table>
DOM-Repräsentation
DOM-Repräsentation


An diesem Beispiel lässt sich der prinzipielle Aufbau des Objektmodells diskutieren: Dokumente werden logisch wie ein Stammbaum dargestellt. Knoten (nodes) stehen über "Verwandtschaftsbeziehungen" zueinander in Verbindung.

Arten von Beziehungen

Die vorliegende Struktur wird im Objektmodell durch die folgenden Beziehungen charakterisiert:

  • Der Wurzelknoten table hat als Kinder (children) die Elementknoten thead und tbody.
  • Der table-Elementknoten ist umgekehrt ein Elternteil (parent) von thead und tbody.
  • Knoten mit gemeinsamem Elternteil (z.B. die beiden th-Elementknoten) werden Geschwister (siblings) genannt.

Ausgehend vom Wurzelknoten ist jeder andere Knoten über diese Verwandtschaftsbeziehungen erreichbar.

Arten von Knoten

Die wichtigsten Knotentypen im DOM sind:

  • Ein Dokumentknoten stellt die gesamte Baumstruktur dar.
  • Ein Dokumentfragmentknoten stellt einen Teil der Baumstruktur dar.
  • Ein Elementknoten entspricht exakt einem Element in HTML oder XML.
  • Ein Attributknoten entspricht exakt einem Attribut in HTML oder XML.
  • Ein Textknoten stellt den textuellen Inhalt eines Elements oder Attributs dar.

Attributknoten stellen eine besondere Knotenart dar, denn sie kommen nicht als Knoten in der Baumstruktur vor, die vor allem durch Elementknoten gebildet wird. Attributknoten sind demnach keine „Kinder“ von Elementknoten, sondern Eigenschaften von ihnen.

Verarbeitung eines Dokuments

Im ersten Schritt wird ein bestehendes Dokument durch das Programm eingelesen und ein Dokument-Objekt erzeugt. Anhand dieses Objekts kann mittels der Methoden des API auf die Inhalte, Struktur und Darstellung zugegriffen werden.

Insbesondere erlaubt DOM

  • die Navigation zwischen den einzelnen Knoten eines Dokuments,
  • das Erzeugen, Verschieben und Löschen von Knoten sowie
  • das Auslesen, Ändern und Löschen von Textinhalten.

Am Ende der Verarbeitung kann aus dem Dokument-Objekt durch so genannte Serialisierung ein neues XML- oder HTML-Dokument generiert werden.

Standardisierung des DOM

Das DOM ist seit 1998 ein Standard des W3C und wurde seitdem mehrfach aktualisiert und erweitert. Es existieren mehrere Versionen (Levels) jeweils mit verschiedenen Modulen:

DOM Level 0

Dieses Level wurde nie formal spezifiziert. Level 0 bezeichnet die mittels JavaScript nutzbaren Techniken zum Zugriff auf HTML-Dokumente. Diese wurden vor der Standardisierung des DOMs eingeführt.

DOM Level 1

  • DOM Core (DOM-Kern) definiert das Bewegen im DOM-Baum, die Manipulation der Knoten, inklusive des Einfügens neuer Elemente und des Setzens von Attributen.
  • DOM HTML stellt eine Erweiterung zum Zugriff auf HTML-Dokumente dar. Es standardisiert und vervollständigt die bereits verbreitete Praxis, die auf den JavaScript-Spezifikationen von Netscape bzw. Microsoft JScript basiert.

DOM Level 2

  • DOM Core: u. a. Erweiterung um XML-Namensraum-Unterstützung
  • DOM HTML: u. a. Ausweitung auf XHTML-Dokumente, Anpassung an DOM 2 Core
  • DOM Style und DOM CSS ermöglichen das dynamische Auslesen, Hinzufügen und Ändern der Formatierung bzw. des Layouts des Dokuments über Stylesheets, insbesondere CSS.
  • DOM Views erlaubt den Zugriff auf Informationen konkreter Wiedergabearten des Dokuments (z.B. der grafischen Darstellung im Webbrowser). Dies wird vor allem zusammen mit DOM CSS benutzt, um die tatsächlichen CSS-Eigenschaftswerte von gewissen Elementen in Erfahrung zu bringen (z.B. ‚Welche Hintergrundfarbe hat diese Überschrift?‘).
  • DOM Events standardisiert die Verarbeitung von Ereignissen im Dokument, z.B. Benutzeraktionen. Wird vor allem im Zusammenhang mit JavaScript bei der Darstellung von HTML-Dokumenten in Webbrowsern verwendet. Angelehnt an die Modelle der Ereignis-Behandlung des Netscape Navigators und des Internet Explorers für HTML-Dokumente.
  • DOM Traversal and Range: Durchlaufen des Knotenbaums anhand von bestimmten Auswahlkriterien, Arbeiten mit Bereichen im Dokument, die bestimmte Elemente und Textknoten umfassen

DOM Level 3

  • DOM 3 Core: umfassende Erweiterung, u. a. verbesserte Ausnahmebehandlung und Umgang mit Zeichenkodierungen
  • DOM 3 Load & Save ermöglicht die Serialisierung von Dokumenten oder Dokumentteilen sowie das Parsen von XML-Dokumenten in Zeichenketten in Dokument-Objekte. Zudem können XML-Dokumente über HTTP versendet und abgerufen werden, wie es mit der bekannteren XMLHttpRequest-Technik möglich ist.
  • DOM 3 XPath erlaubt das Auswählen von Knoten anhand von XPath-Audrücken.
  • DOM 3 Events erweitert DOM 2 Events u. a. um Tastatur-Ereignisse.
  • DOM 3 Validation
  • DOM 3 Views and Formatting
  • DOM 3 Abstract Schemas

Siehe auch

  • SAX Simple API for XML — Alternative zu DOM. Arbeitet ereignisorientiert.
  • XPath

Weblinks




Dieser Artikel basiert auf dem Artikel Document_Object_Model aus der freien Enzyklopädie Wikipedia. Er steht unter der GNU-Lizenz für freie Dokumentation. In diesem Wiki und / oder der Wikipedia ist eine Liste der Autoren verfügbar.



Wurde_publiziert_von::W3C