D O M

Document Object Model

Seminar „XML und Datenbanken“ SS 2004

Michael Stanek

Gliederung

1. Was ist DOM? - Allgemeines und Historie

2. DOM – Objektmodell - Was versteht man darunter? - DOM-Baum - Beispiel XML-Dokument als DOM-Baum

3. Modulkonzept - Grundidee - Modulhierarchie

4. Schnittstellen - Schnittstellenhierarchie - Schnittstelle: Was für Methoden? Auswirkung am obigen Bsp. - Node, Document, etc.

5. Zusammenfassung

1. Was ist DOM? - Allgemeines per W3C definierte Schnittstelle unterstützt wohlgeformte und gültige

XML-Dokumente abstrakt und sprachneutral Definition von Schnittstellen und Methoden

für Durchsuchen, Zugriff, Einfügen, Ändern und Löschen von Dokumentinhalten

alle Objekte sind in einer hierarchischen Baumstruktur angeordnet – dem DOM-Baum

1. Was ist DOM? - Historie Entwicklung begann 1996 durch unterschiedliche Ansätze für

DHTML DOM Level 1 am 01.10.1998

Zunächst nur Objektstruktur und Objektdefinitionen Methodendefinitionen

DOM Level 2 am 13.11.2000 Vertiefung von DOM Level 1 Definitionen Einbindung von XML-Namensräumen und Cascading Style

Sheets DOM Level 3 am 06.04.2004

Verstärkung von dynamischer Änderung von Dokumentinhalten

Load & Save

2. Das DOM-Objektmodell Daten aus XML-Dokument für Applikation

zugänglich machen Schnittstelle zwischen XML-Dokument und

Applikation zum Arbeiten auf den Daten Quasi-Standard, Empfehlung XML-Dokumente hierarchisch aufgebaut

→ logische Struktur Überprüfung mittels Parser

2.1 DOM-Strukturmodell

Struktur wird in „DOM-Strukturmodell“ übernommen

günstige Implementierungsform „Baum-ähnlich“

Applikation arbeitet auf „DOM-Baum“ (read & write)

2.2 DOM-Baum alle XML-Elemente sind Knoten mit gewissen

Eigenschaften jeder Baum besitzt genau einen

Wurzelknoten, welcher das gesamte XML-Dokument repräsentiert

über Diesen erfolgt Zugriff auf restliche Elemente (Navigation)

keine sonstigen Implementationsvorschriften, allerdings Forderung nach strukturellem Isomorphismus

2.2 DOM-Baum – Beispiel (XML-Datei)

<!DOCTYPE InstitutXML><institut> <name>Institut für Informatik</name> <direktor>Prof. Dr.

H.-D. Hecker</direktor> <lehrstuhl> Datenbanken <leiter> <name>Prof. Dr. K. Küspert</name> </leiter> <mitarbeiter> <name>Dipl. Inf. T. Müller</name> </mitarbeiter> <mitarbeiter> <name>Dipl. Inf. K. Stolze</name> </mitarbeiter> </lehrstuhl> <lehrstuhl> <name>Softwaretechnik</name> .... </lehrstuhl></institut>

3. Modulkonzept DOM-Funktionalität ist in Module

aufgeteilt Module sind hierarchisch aufgebaut Basismodul ist Core-Modul und muss

von jeder DOM-Implementierung bereitgestellt werden

weitere Module spezialisieren Grundfunktionen

3.1 Modulhierarchie

Aösjfljdsflajfs

Core: Grundfunktionen für Navigation und Manipulation

Views: Sichtdefinitionen

Events: Ereignisbehandlung

Traversal: Traversierungsfunktionen

Range: Bereichszugriffe

4. Schnittstellen für jeden Knotentyp

gibt es separate Schnittstelle

Schnittstellen sind hierarchisch angelegt

fast alle Knotentypen stammen von Klasse Node ab

4.1 Knotentypen im Beispiel

4.2 Schnittstelle Node Basisschnittstelle für fast alle weiteren

Dokumentbestandteile (Objekte) vereinigt gemeinsamen Eigenschaften der

verschiedenen Knotentypen alle weiteren Objekte müssen Methoden von Node implementieren

Methoden für Identifikation von Knoten, Navigation im DOM-Baum sowie Manipulation der Baumstruktur

4.2.1 Identifikation da fast alle Knotentypen von Node

abstammen, muss eindeutige Identifikation gewährleistet werden, um z.B. speziellere Methoden einsetzen zu können nodeType()

jeder Knoten besitzt zusätzlich einen definierten Namen (Bsp. „mitarbeiter“), der für Navigationszwecke gebraucht werden kann nodeName()

4.2.2 Navigation

Zugriff auf Kindknoten und Vaterknoten hasChildNodes() & childNodes() firstChild() & lastChild() parentNode()

Zugriff auf Knoten der gleichen Hierarchieebene previousSibling() & nextSibling()

4.2.2 Navigation (Bsp)

6

1

2 3 4

5

1 parentNode()2 childNodes()3 firstChild()4 lastChild()5 previousSibling()6 nextSibling()

4.2.3 Strukturmanipulation Einfügen neuer Knoten

insertBefore(newNode) appendChild(newNode)

Verändern bereits vorhandener Knoten replaceChild(refNode, newNode) removeChild(refNode)

Kopieren von Knoten cloneNode(deep)

deep ≡ boolean-Variable, für flache (false) bzw. tiefe (true) Kopie gesetzt

Insert und Update-Vorgänge verlangen jeweils fertige Knoten vom Typ Node, die vorher erzeugt werden müssen (→ Schnittstelle Document)

4.2.3 Strukturmanipulation

(Bsp 1)

ref_Node.insertBefore(newNode)

4.2.3 Strukturmanipulation

(Bsp 2)

ref_Node.appendChild(newNode)

4.3 Schnittstelle Document repräsentiert den Zugang zu einem XML-Dokument

und ist Ergebnis des Parse-Vorgangs konzeptuell gesehen, ist es die Wurzel bzw. der

Einstieg in jeden DOM-Baum (Primärzugriff für Dokumentdaten)

Elemente, Textknoten, Kommentare, etc. existieren nicht ohne Zusammenhang zu einem Dokument→ Document enthält die Factory-Methoden zur Erzeugung dieser Objekte (Datenmanipulation)

erzeugte Objekte besitzen ein Attribut ownerDocument zur Bindung an das entsprechende Dokument (allerdings im Interface Node deklariert)

4.3.1 Information Document enthält Attribute die Informationen

über das entsprechende Dokument beinhalten doctype

enthält den Dokumententyp (DOCTYPE in XML)

implementationenthält Infos zur verwendeten DOM-API

documentElementliefert das „eigentliche“ Wurzelelement des DOM-Baums

getElementbyTagName(tagname)liefert eine Liste von Knoten die dem tagname entsprechen

4.3.1 Information (Bsp)

4

2 3

1 doctype2 implementation3 documentElement4 getElementByTagname(„mitarbeiter“)1

4.3.2 Datenmanipulation

Factory-Methoden createElement(tagname) createAttribute(name) createTextNode(data) etc.

createDocumentFragment()Container für möglich Teilbäume

4.3.2 Datenmanipulation (2)

Unterstützung der jeweiligen Schnittstelle nötig, da Werte gesetzt werden müssen (tagname, data, etc.)

Schnittstelle Element setAttribute(name, value) removeAttribute(name)

Schnittstelle Attr setValue(value)

4.4 Beispiel

Beispiel für appendChild(refNode, newNode)im Dokument „institut“

Es soll ein neuer Mitarbeiter im Lehrstuhl „Datenbanken“ eingetragen werden

Voraussetzungen: Referenz auf Vaterknoten ‘lehrstuhl‘ (vorher Navigation) Einzufügender Knoten ‘mitarbeiter‘ muss vorher generiert

werden ref_lehrstuhl.appendChild(neu_mitarbeiter) ref_mitarbeiter.appendChild(neu_name)

Navigation node = getElementByTagname(„Datenbanken“) ref_lehrstuhl = node.parentNode();

4.4 Beispiel (2)

1 = getElementByTagname(„Datenbanken“)2 = node.parentNode();

1

2

4.4 Beispiel (3)

Generieren des neuen Knotens durch Zugriff auf Factory-Methoden der Schnittstele Document neu_mitarbeiter = institut.createElement(„mitarbeiter“) neu_name = institut.createTextNode(„Student Alex“)

Einfügen mittels appendNode() ref_mitarbeiter =

ref_lehrstuhl.appendNode(neu_mitarbeiter) ref_name = ref_mitarbeiter.appendNode(neu_name)

4.4 Beispiel (4)

4.4 Beispiel (4)

1 = ref_lehrstuhl.appendNode(neu_mitarbeiter)

4.4 Beispiel (4)

1 = ref_lehrstuhl.appendNode(neu_mitarbeiter)

2 = ref_mitarbeiter.appendNode(neu_name)

5. Zusammenfassung abstrakt und sprachneutral Hierarchische Anlehnung in Baum-Form Navigation und Manipulation großer Speicherbedarf da kompletter Baum

abgelegt werden muss → nicht für große Dokumente geeignet

relativ langsam beim Parsen im Vergleich zu SAX, da Baum erst generiert werden muss

Fragen ?