sdplnotes 3.2: dom1 3.2 document object model (dom) n how to provide uniform access to structured...

SDPL Notes 3.2: DOM 1

3.2 Document Object Model (DOM)3.2 Document Object Model (DOM)

How to provide uniform access to structured How to provide uniform access to structured documents in diverse applications (parsers, documents in diverse applications (parsers, browsers, editors, databases)?browsers, editors, databases)?

Overview of W3C DOM SpecificationOverview of W3C DOM Specification– DOM standardisation began in Spring 1997DOM standardisation began in Spring 1997– the second recommendation in the “XML-family” the second recommendation in the “XML-family”

of standardsof standards» Level 1, W3C Rec, Oct. 1998Level 1, W3C Rec, Oct. 1998» Level 2, W3C Rec, Nov. 2000Level 2, W3C Rec, Nov. 2000» Level 3, (an early) W3C Working DraftLevel 3, (an early) W3C Working Draft


DOM: What is it?DOM: What is it?

DOM Specification:DOM Specification:

““a platform- and language-neutral a platform- and language-neutral interfaceinterface that that allows programs and scripts allows programs and scripts toto dynamically dynamically access access and updateand update the the content, structure and style of content, structure and style of documentsdocuments. … [DOM] provides a standard . … [DOM] provides a standard set of set of objects for representing HTML and XML documentsobjects for representing HTML and XML documents, , a standard model of how these objects can be a standard model of how these objects can be combined, and a standard interface for accessing combined, and a standard interface for accessing and manipulating them.”and manipulating them.”


DOM: What is it? (2)DOM: What is it? (2)

An API for XML and HTML documentsAn API for XML and HTML documents

– allows programs and scripts to build allows programs and scripts to build documents, navigate their structure, add, documents, navigate their structure, add, modify or delete elements and contentmodify or delete elements and content

– Provides a foundation for developing Provides a foundation for developing querying, filtering, querying, filtering, transformation, rendering etc. transformation, rendering etc.

applications on top of DOM implementationsapplications on top of DOM implementations


DOM DOM structure model structure model (1)(1)

Roughly similar to the XSLT/XPath data Roughly similar to the XSLT/XPath data model (to be discussed later)model (to be discussed later)

a parse tree a parse tree Example document:Example document:

<article><article><para>Written by the lecturer.<para>Written by the lecturer. <fig file="pekka.jpg" <fig file="pekka.jpg"

caption="The caption="The Lecturer"/>Lecturer"/>

</para></para></article></article>



Corresponding structure model:Corresponding structure model:

Document

artic le

W ritten bythe lectu rer.

fig

para

file= "pekka.jpg"c aption="The Lec turer"

E lem ent:Text:C h ild :a ttribu tes :N am edN odeM ap:



The tree-like structureThe tree-like structure– is implied by the abstract relationships defined by is implied by the abstract relationships defined by

the programming interfaces;the programming interfaces;– does not necessarily reflect data structures used does not necessarily reflect data structures used

by an implementation (but probably does) by an implementation (but probably does)

Based on O-O concepts:Based on O-O concepts:– methodsmethods (to access or change object’s state) (to access or change object’s state)– interfacesinterfaces (declaration of a set of methods) (declaration of a set of methods) – objectsobjects (encapsulation of data and methods) (encapsulation of data and methods)


Object-based document modellingObject-based document modelling

Object model coversObject model covers– structure of a documentstructure of a document– behaviour of a document and its constituent behaviour of a document and its constituent

objectsobjects

DOM definesDOM defines– interfaces and objects for representing and interfaces and objects for representing and

manipulating documentsmanipulating documents– semantics of these interfacessemantics of these interfaces– relationships between interfaces and objectsrelationships between interfaces and objects


DOM: Background & supportDOM: Background & support

Background: Background: – JavaScript, “Dynamic HTML” JavaScript, “Dynamic HTML” – APIs for structured document editors and repositories APIs for structured document editors and repositories

ImplementationsImplementations– Java-based parsers Java-based parsers

(e.g. (e.g. Sun Project X, IBM XML4J, Sun Project X, IBM XML4J, Apache Xerces)Apache Xerces)– MS IE5 browser: COM programming interfaces for C/C++ MS IE5 browser: COM programming interfaces for C/C++

and MS Visual Basic, ActiveX object programming interfaces and MS Visual Basic, ActiveX object programming interfaces for script languages for script languages

– Others? Non-parser-implementations? Others? Non-parser-implementations? (Vendor involvement in DOM WG was quite impressive.)(Vendor involvement in DOM WG was quite impressive.)


Structure of DOM Level 1Structure of DOM Level 1

Two parts:Two parts:I: DOM I: DOM Core InterfacesCore Interfaces

– Fundamental interfacesFundamental interfaces » low-level interfaces to structured documentslow-level interfaces to structured documents

– Extended interfaces Extended interfaces » XML specific: CDATASection, DocumentType, XML specific: CDATASection, DocumentType,

Notation, Entity, EntityReference, Notation, Entity, EntityReference, ProcessingInstructionProcessingInstruction

II: DOM II: DOM HTML InterfacesHTML Interfaces– more convenient to access HTML documentsmore convenient to access HTML documents– (we ignore these)(we ignore these)


DOM Level 2DOM Level 2

Level 1 intentionally limited to representation and Level 1 intentionally limited to representation and manipulation of document structure and contentmanipulation of document structure and content– document instance only; no access to the contents of a DTDdocument instance only; no access to the contents of a DTD

DOM Level 2 adds DOM Level 2 adds – support for namespacessupport for namespaces– accessing elements by ID attribute valuesaccessing elements by ID attribute values– optional featuresoptional features

» interfaces to document views and stylesheetsinterfaces to document views and stylesheets» an event model (for, say, user actions on elements)an event model (for, say, user actions on elements)» methods for traversing the document tree and manipulating methods for traversing the document tree and manipulating

regions of document (e.g., selected by the user of an editor)regions of document (e.g., selected by the user of an editor)


DOM Language BindingsDOM Language Bindings

DOM interfaces are defined using OMG DOM interfaces are defined using OMG Interface Definition Language (IDL; Defined in Interface Definition Language (IDL; Defined in Corba Specification)Corba Specification)

Language bindings (implementations of DOM Language bindings (implementations of DOM interfaces) defined forinterfaces) defined for– Java andJava and– ECMAScript (standardised JavaScript/JScript)ECMAScript (standardised JavaScript/JScript)


Overview of DOM Core InterfacesOverview of DOM Core Interfaces

All document components can be accessed All document components can be accessed through the base interface through the base interface NodeNode, or through , or through interfaces derived from it:interfaces derived from it:– Document, DocumentFragment, Element, Document, DocumentFragment, Element, Attr, Text, Comment Attr, Text, Comment

(fundamental interfaces)(fundamental interfaces)– CDATASection, DocumentType, Notation, CDATASection, DocumentType, Notation, Entity, EntityReference, Entity, EntityReference, ProcessingInstruction ProcessingInstruction

(extended interfaces)(extended interfaces)


Additional Core InterfacesAdditional Core Interfaces

to handle ordered lists of nodes:to handle ordered lists of nodes: NodeList NodeList – e.g. frome.g. from Node.childNodesNode.childNodes or or Element.getElementsByTagName("name")Element.getElementsByTagName("name")

» all descendant elements of type all descendant elements of type "name" "name" in document in document order order

» "*""*" a wild-card matching any element type a wild-card matching any element type to access unordered sets of nodes by name:to access unordered sets of nodes by name: NamedNodeMapNamedNodeMap– e.g. frome.g. from Node.attributesNode.attributes

NodeListNodeLists and s and NamedNodeMapNamedNodeMaps are "live":s are "live":– changes to the document structure reflected to changes to the document structure reflected to

their contentstheir contents


Object Creation in DOMObject Creation in DOM

Each DOM object Each DOM object XX lives in the context of a lives in the context of a Document: Document: XX.ownerDocument.ownerDocument

Objects implementing interface Objects implementing interface YY are created are created by factory methods by factory methods

DD.create.createYY(…)(…) , ,where D is awhere D is a DocumentDocument object. E.g:object. E.g: – createElement("A"), createElement("A"), createAttribute("href"), createAttribute("href"), createTextNode("Hello!")createTextNode("Hello!")

Creation and persistent saving of Creation and persistent saving of DocumentDocuments s left to be specified by implementationsleft to be specified by implementations


Object manipulation in DOMObject manipulation in DOM

Manipulating children of aManipulating children of a nodenode::– node.insertBeforenode.insertBefore((newChild, refChildnewChild, refChild)) – node.replaceChildnode.replaceChild((newChild, oldChildnewChild, oldChild)) – node.removeChildnode.removeChild((oldChildoldChild)) – node.appendChildnode.appendChild((newChildnewChild))

Accessing a specific child, or iterating over Accessing a specific child, or iterating over children by indexing items of a children by indexing items of a NodeListNodeList::– Using the Java binding of DOM:Using the Java binding of DOM:for (i=0;for (i=0;

i<node.getChildNodes().getLength(); i<node.getChildNodes().getLength(); i++) i++)

process(node.getChildNodes().item(i));process(node.getChildNodes().item(i));


Content and element manipulationContent and element manipulation

ManipulatingManipulating CharacterDataCharacterData DD::– DD.substringData(.substringData(offset, countoffset, count)) – DD.appendData(.appendData(stringstring)) – DD.insertData(.insertData(offset, stringoffset, string)) – DD.deleteData(.deleteData(offset, countoffset, count)) – DD.replaceData(.replaceData(offset, count, stringoffset, count, string))(= delete + insert)(= delete + insert)

Accessing attributes of anAccessing attributes of an ElementElement object E object E::– EE.getAttribute(.getAttribute(namename)) – EE.setAttribute(.setAttribute(name, valuename, value)) – EE.removeAttribute(.removeAttribute(namename))


Accessing properties of aAccessing properties of a NodeNode

– Node.nodeNameNode.nodeName » for an for an Element = tagNameElement = tagName» for an for an Attr:Attr: the name of the attribute the name of the attribute» for for Text = "#text"Text = "#text" etc etc

– Node.nodeValueNode.nodeValue » content of a text node, value of attribute, …; content of a text node, value of attribute, …;

nullnull for an for an ElementElement (in XSLT/Xpath: the full text content of elem)(in XSLT/Xpath: the full text content of elem)

– Node.nodeTypeNode.nodeType:: numeric constants (1, 2, 3, …, numeric constants (1, 2, 3, …, 12) for12) for ELEMENT_NODE, ATTRIBUTE_NODE, ELEMENT_NODE, ATTRIBUTE_NODE, TEXT_NODE, …, NOTATION_NODETEXT_NODE, …, NOTATION_NODE


Accessing Context of aAccessing Context of a NodeNode

– Node.parentNodeNode.parentNode» for all nodes except for for all nodes except for

DocumentDocument, , DocumentFragmentDocumentFragment, , AttrAttr nodes nodes EntityEntity or or NotationNotation nodes nodes

» DocumentFragmentsDocumentFragments used as temporary used as temporary holders of forests; holders of forests; Attrs, Entities and Attrs, Entities and NotationsNotations hang in a hang in a NamedNodeMapNamedNodeMap

– Node.firstChildNode.firstChild, , NodeNode..lastChildlastChild, , Node.previousSibling,Node.nextSiblingNode.previousSibling,Node.nextSibling » nullnull if the child or sibling does not existif the child or sibling does not exist