Document Object Model (DOM)

Document Object Model (DOM)

Copyright ┬ę Shutterstock / BEST-BACKGROUNDS

Was ist ein Document Object Model?

Das Document Object Model (DOM) ist eine plattform├╝bergreifende und sprachunabh├Ąngige Anwendungsprogrammier-Schnittstelle. Diese Schnittstelle behandelt ein XHTML– oder XML-Dokument als Baumstruktur, w├Ąhrend jeder Knoten (Verkn├╝pfungspunkte der ├ťbertragungswege) ein Objekt ist und einen Teil des Dokuments darstellt (z. B. ├ťberschrift, Absatz, Tabelle, Video). Die Objekte k├Ânnen programmatisch manipuliert werden und alle sichtbaren ├änderungen, die als Ergebnis auftreten, k├Ânnen sich dann in der Anzeige des Dokuments widerspiegeln.

Die grundlegende Standardisierung von Document Object Model (DOM) wurde vom World Wide Web Consortium ├╝bernommen, das im Jahr 2004 eine Empfehlung entwickelt hatte. WHATEG (Web Hypertext Application Technology Working Group) ├╝bernahm diese Standard-Entwicklung und ver├Âffentlichte es als lebendiges Dokument. Das W3C ver├Âffentlichte nun stabile Momentaufnahmen des WHATEG-Standards.

Funktion

Die Webseite steht dem Browser nur als Text zur Verf├╝gung. Dieser Text ist zun├Ąchst mit einer Auszeichnungssprache in HTML formatiert. Der Browser empf├Ąngt sodann den Code ├╝ber das Netzt und verarbeitet diesen. Diese Aufgabendurchf├╝hrung erfolgt ├╝ber den Parser (Pr├╝fung, ob eine Folgenreihe aus Symbolen aus der Grammatik heraus in eine Quellsprache erzeugt werden kann). Anschlie├čend transportiert der Parser den HTML-Code in eine Objektstruktur, die aus komplexen Knoten besteht (z. B. Element-, Attribut- und Textknoten).

F├╝r alle weiteren Operationen verwendet der Browser nun diese Objektstruktur ÔÇô┬ájedoch nicht den HTML-Quellcode. Besonders CSS┬áund JavaScript greifen nicht auf den HTML-Code als Text zur├╝ck, sondern auf den vorhandenen Elementenbaum im jeweiligen Speicher.

Standards des Document Object Model (DOM)

Die W3C DOM Working Group ver├Âffentlichte ihre endg├╝ltige Empfehlung und l├Âste sich 2004 auf. Die Entwicklungsbem├╝hungen migrierten auf die WHATEG, die weiterhin einen Standard aufrechterh├Ąlt. Im Jahr 2009 hat die Gruppe Web Applications die Document Object Model (DOM)-Aktivit├Ąten am W3C neu organisiert. Sp├Ąter, im Jahr 2013, wurde die DOM-Level-4-Spezifikation aufgrund fehlender Fortschritte und der bevorstehenden Ver├Âffentlichung von HTML5 oder HTML-Arbeitsgruppe neu zugewiesen, um die Fertigstellung voranzutreiben. In der Zwischenzeit wurde die Gruppe Web Applications im Jahr 2015 aufgel├Âst und die DOM Stewardship an die Web Platform Group weitergegeben. Beginnend mit der Ver├Âffentlichung von DOM Level 4 im Jahr 2015 erstellte das W3C neue Empfehlungen, die auf Momentaufnahmen der WHATEG-Standards basierten.

lieferte ein vollst├Ąndiges Modell f├╝r ein gesamtes HTML- oder XML-Dokument, einschlie├člich der M├Âglichkeit, jeden Teil des Dokuments zu ├Ąndern.
wurde Ende 2000 ver├Âffentlicht. Es f├╝hrte die Funktion getElementByld sowie ein Ereignismodell und Unterst├╝tzung f├╝r XML-Namespaces und CSS ein.
ver├Âffentlicht im April 2004, hat die [url=https://de.ryte.com/wiki/xpath]XPath[/url]- und Tastatur-Ereignisbehandlung sowie eine Schnittstelle zum Serialisieren von Dokumenten als [url=https://de.ryte.com/wiki/XML]XML[/url] unterst├╝tzt.
wurde im Jahr 2015 publiziert. Es ist eine Momentaufnahme des WHATEG Standards.

Web Browser

Um ein Dokument wie eine HTML-Seite zu rendern (Erstellung einer Grafik aus einer Skizze), verwenden die meisten Webbrowser ein internes Modell, das dem Document Object Model (DOM) ├Ąhnelt. Die Knoten jedes Dokuments sind in der Baumstruktur organisiert, die als DOMBaum bezeichnet wird, wobei der oberste Knoten Dokumentenobjekt genannt wird. Wenn eine HTML-Seite in Browsern gerendert wird, l├Ądt der Browser das HTML in den lokalen Speicher und analysiert es automatisch, um die Seite auf dem Bildschirm anzuzeigen.

JavaScript

Wenn eine Webseite geladen wird, erstellt der Browser ein Document Object Model (DOM) der Seite, das eine objektorientierte Darstellung eines HTML-Dokuments ist. Es dient als Schnittstelle zwischen JavaScript und dem Dokument selbst und erm├Âglicht die Erstellung dynamischer Webseiten.
JavaScript kann alle HTML-Elemente und -Attribute auf der Seite hinzuf├╝gen, ├Ąndern und entfernen, alle CSS-Stile ├Ąndern, auf vorhandene Ereignisse auf der Seite reagieren und neue Ereignisse erstellen.

Implementierung

Da Document Object Model (DOM) die Navigation in jede Richtung unterst├╝tzt und beliebige Modifikationen zul├Ąsst, muss eine Implementierung mindestens das Dokument puffern, das bisher gelesen wurde (oder eine sogenannte geparste Form davon).

Layout-Engines

Webbrowser verlassen sich auf die LayoutEngines, um HTML in ein Document Object Model (DOM) zu zerlegen. Einige Layout-Engines, z. B. Trident/MSHTML, sind haupts├Ąchlich oder ausschlie├člich mit einem bestimmten Browser verkn├╝pft, wie z. B. der Internet Explorer. Andere, einschlie├člich Blink, WebKit und Gecko, werden von einer Reihe von Browsern wie Google Chrome, Safari, Firefox und Opera gemeinsam genutzt. Die verschiedenen Layout-Engines implementieren die Standards von Document Object Model (DOM) in unterschiedlichem Ma├če.


Sie haben noch Fragen?

Kontaktieren Sie uns

Kostenloser SEO-Check der OSG


Weitere Inhalte