The Details of the Document Object Model (DOM)

This chapter is from the book 

DOM Level II

The Document Object Model Level II (the DOMII) defines a set of interfaces to create, manipulate, track, and view an XML document. DOM Level II goes beyond Level I and, for the most part, fills in areas where it is clear that additional functionality is required.

Specifically, the DOMII provides interfaces for the following:

• HTML— A set of HTML-specific interfaces, such as HTMLDocument and HTMLElement, which allow for processing HTML documents by the DOM. We will not look closely at the HTML interfaces because they are outside the scope of this text.

• Views— A set of interfaces for working with views. A view is like a window into a document. DOMII views are very much like the traditional concepts of a view with two different applications, or different objects in the same application, looking onto different parts of a document. A view could be thought of in terms of an HTML frame or a computed view after a stylesheet has been applied.

• Stylesheets— The DOMII introduces a number of interfaces that represent the generic concept of a stylesheet. The DOMII specification provides for examining stylesheets in a generic fashion and treating them very much like XML Document objects.

• CSS Stylesheets— Because CSS use is so prevalent, the DOMII contains a set of interfaces for accessing CSS stylesheets. We will only give light coverage of this area of the specification because it's superceded by XSL stylesheets.

• Events— One of the long-awaited features of DOMII is support for events. The event interfaces cover such areas as basic event flow and event registration and define User Interface (UI), Mouse, Key, Mutation, and HTML events. We will concentrate on Mutation events because they are the most applicable to Java programming/XML.

• Traversal— The DOMII defines a set of interfaces that are collectively lumped into the group Traversal. These interfaces, much like the JDK1.2 collections interfaces, define mechanisms for walking a tree in either tree or list order.

• Range— The final area covered by the DOMII is Range. Ranges cover what we traditionally think of as selections and define the concepts of boundary elements and what is meant by a range of elements between two boundary elements.

View Interfaces

Perhaps the simplest set of interfaces in DOMII is the view interfaces. View defines a window or view onto a XML Document object. Views are optional and may not be provided by an implementation. There are two view interfaces:

• AbstractView An abstract view contains a single, read-only attribute DocumentView document.

• DocumentView The DocumentView interface is implemented by Document objects and contains a single, read-only attribute, AbstractView defaultView, which refers to the default document.

The view interfaces can be used collectively to get the original document from a view and views from documents.

Stylesheet Interfaces

There are a five stylesheet interfaces:

• StyleSheet An interface representing a generic stylesheet. In XML documents, StyleSheet objects are created in reference to stylesheet processing instructions. The StyleSheet interface contains attributes:

  • DOMString type The type of the stylesheet (`test/css' for example).

  • Boolean disabled Is this stylesheet associated with a document?

  • Node ownerNode The document the stylesheet is associated with.

• StyleSheetList An ordered list of all the StyleSheet objects. Contains a length attribute representing the number of stylesheets in the list and a StyleSheet item() method for returning a given stylesheet.

• MediaList An unordered list of all the media type associated with a StyleSheet. The MediaList interface provides methods for accessing each of the media types associated with a stylesheet, as well as methods to add and delete media types.

• LinkStyle The LinkStyle interface is provided so that the stylesheet object associated with a document can be retrieved, for example via a processing instruction. It contains a single attribute StyleSheet sheet.

• DocumentStyle The DocumentStyle interface provides a mechanism for accessing stylesheets from a Document object and contains a single attribute StyleSheetList styleSheets. The DocumentStyle interface is normally implemented by Document objects.

Events

From a Java developer's perspective, events are one of the more interesting areas of the DOMII specification. Events are interesting because they define a mechanism whereby an application can determine easily at runtime how a Document is changing. Events fall into three broad categories:

• UI Events— UI Events are those events generated by the user interface. UI events are typically the result of external devices, such as a mouse click or a key press.

• UI Logical Events— UI Logical Events are a step above normal UI Events in that they detail higher level happenings, such as changes to fonts, pointer focus changes, and so on.

• Mutation Events— From a Java/DOM perspective, Mutation Events are the most interesting type of event. Mutation events alert applications to changes in the underlying structure of a DOM Document. Every time a node is changed, added, or deleted, the potential exists for a UI event to occur.

There are three principal participants in DOM event parsing. Event producers, any class that implements the Node interface, generate events that can be consumed by event consumers. Event consumers are informed whenever something happens to an object to which they are listening. And Events themselves are passed from an event generator to an event consumer to inform a consumer what has happened. In fact, there is no reason that an event consumer could not produce events as well, perhaps to propagate information from one area of an application to another.

Because DOM Documents are tree structured, a single event type does not suit all event happenings. The DOMII specification defines three kinds of event processing:

• Capturing— Capturing allows an event consumer to capture an event; that is, stop it from propagating from one event consumer to another.

• Bubbling— Bubbling is the process whereby a single event at a leaf node is propagated or bubbled all the way up a tree from one node to its parent. When a node is bubbled, each event consumer is given the chance to act on it. Using bubbling, an application can register to receive an event on the root of a Document and see all events on that document's children.

• Cancelable— Cancelable events can be stopped from being processed by a given event listener. Cancelable events are normally used to override the additional processing that might be incurred as an event bubbles up through a Document tree.

There are three main interfaces used with DOMII events.

• EventTarget Node objects implement the EventTarget interface. The EventTarget interface contains three methods:

  • addEventListener(String type, EventListener listener, boolean useCapture) Registers classes to handle events

  • removeEventListener(String type, EventListener listener, boolean useCapture) Removes previously registered listeners

  • dispatchEvent(Event) Generates an event

• EventListener Classes that want to consume events on a given Node or Document do so by implementing the EventListener interface. This interface has a single method, handleEvent(Event), which is called when an event happens.

• Event The Event class itself is the currency that EventListeners and EventTargets trade in. Event objects contain a number of fields that the consumer can act on, such as the Node associated with the event—whether the event is cancelable or not, whether the event bubbles or not. The Event class also contains a number of methods that allow an EventListener to change how the event is processed. For example, the stopPropagation() method allows a listener to stop a bubbling event from being delivered to listeners registered higher up in the DOM tree.

There are a number of additional classes that derive from the Event class:

• UIEvent Events that encapsulate additional information about the View in which they happened.

• MouseEvent Events that contain pointer-related information, such as screen x/y position, and keyboard state, such as whether the Ctrl key was pressed or not, and so on.

• MutationEvent Events that contain related Node information, previous and current value, and other applicable Node information. MutationEvents have a number of derived events, such as DOMSubtreeModified, DOMNodeInserted, DOMNodeRemoved, DOMAttrModified, and so on.

Traversal Interfaces

Anyone who has used the JDK1.2 collection classes will be comfortable with the DOMII Traversal interfaces. There are two main interfaces for Document traversal—NodeIterator and TreeWalker. A third interface, NodeFilter, allows developers to write filters to limit the num-ber of elements returned by the two traversal interfaces.

Iterators

The Iterator interface provides a mechanism whereby a developer can walk a flattened ver-sion of a Document. Iterators are created by calling the createNodeIterator() on a Document object as shown in the following:

						
NodeIterator iterator =  document.createNodeIterator(rootNode,whatToShow,filter);

where rootNode is the starting Node object, whatToShow is a bitwise ored combination from Table 3.2, and filter is any class that implements the NodeFilter interface or null.

There are three methods of note on the Iterator interface:

• Node nextNode() Returns the next node in the list.

• Node previousNode() Returns the previous node in the list.

• void detach() Releases any resources associated with the Iterator. Subsequent calls to the iterator will raise an exception.

One of the interesting aspects of iterators is how they react in the face of change. Iterators are defined to represent the current structure of a Document tree and must correctly handle situa-tions where the previous or next node has been deleted or new nodes added.

Conceptually an Iterator has a concept of a current node. Consider, for a moment, the following list of nodes:

						
* A B C D E F G *

^(current node)

When the iterator is first created, the current node is null. Calls to getNext() would return A, and calls to getPrevious() would return null. Likewise, if the current node was after G, as shown next, getNext() would return null and getPrevious() would return G.

						
* A B C D E F G *

               ^(current node)

If a node was added or removed, the Iterator would still behave as you would expect with the list effectively "shifting" left or right as required. For example, assume we have the following situation:

						
* A B C D E F G *

       ^(current node)

where the current node D, and next returning E and previous returning C. If node E was removed, the Iterator would correctly return node F. If an additional node was inserted after D called D', the iterator would return D' for next.

In addition to the logical behavior of Iterators we've already seen, Node objects also have a behavior known as visibility. The second and third parameters to the createNodeIterator() method are a bit mask and a filter, respectively. These two parameters define whether a node is visible and will be returned by getNext() or getPrevious(). The functioning of the bit mask is fairly common. For example, if you only want TEXT and COMMENT nodes, provide a mask of NodeFilter.SHOW_TEXT | NodeFilter.SHOW_COMMENT. Or in additional constants to return other Elements of the Document. We will examine filters shortly.

TableÊNodeFilter Constants

Constant	Description
NodeFilter.SHOW_ALL	Return all elements
NodeFilter.SHOW_ELEMENT	Return Element objects
NodeFilter.SHOW_ATTRIBUTE	Return Attribute objects
NodeFilter.SHOW_TEXT	Return Text objects
NodeFilter.SHOW_CDATA_SECTION	Return CDATA objects
NodeFilter.SHOW_ENTITY_REFERENCE	Return EntityReference objects
NodeFilter.SHOW_ENTITY	Return Entity objects
NodeFilter.SHOW_PROCESSING_INSTRUCTION	Return ProcessingInstruction objects
NodeFilter.SHOW_COMMENT	Return Comment objects
NodeFilter.SHOW_DOCUMENT_TYPE	Return DocumentType objects
NodeFilter.SHOW_DOCUMENT_FRAGMENT	Return DocumentFragment objects
NodeFilter.SHOW_NOTATION	Return Notation objects

TreeWalkers

TreeWalkers provide a mechanism whereby developers can walk the actual tree structure of a Document.

TreeWalkers are created by calling the createTreeWalker() method on a Document object, as shown in the following:

						
    TreeWalker walker =  document.createTreeWalker(rootNode,whatToShow,filter);

where rootNode is the starting Node object, whatToShow is a bitwise ored combination from Table 3.2, and filter is any class that implements the NodeFilter interface or null.

There are seven methods of note on the TreeWalker interface:

• Node parentNode() Returns the parent of the current node

• Node firstChild() Returns the first child of the current node

• Node lastChild() Returns the last child of the current node.

• Node previousSibling() Returns the sibling logically to the left of the current node.

• Node nextSibling() Returns the sibling logically to the right of the current node.

• Node previousNode() Returns the previous node in the document. Note that previousNode() and nextNode() can move up and down the tree, whereas the sibling methods will not.

• Node nextNode() Returns the next node in the tree, moving down the tree as required.

If we consider the following tree:

						
                A
              B   C
             D E  F G
            H I

and B is the current node:

• getParent() returns A

• previousSibling() returns null

• nextSibling() returns C

• firstChild() returns D

• lastChild() returns E

• previousNode() returns A

• nextNode() returns C

Filters

The final interface in the Iterator set of interfaces is the NodeFilter interface. Node filters provide developers with a finer level of control over when Elements are returned by Iterators and TreeWalkers by allowing a developer to examine a node and return NodeFilter.FILTER_ACCEPT, NodeFilter.FILTER_REJECT, or NodeFilter.FILTER_SKIP to have the Iterator or TreeWalker return, ignore, or skip a given node. The NodeFilter interface has a single method, short acceptNode(Node node), and must return one of the three previously listed constants.

For example, the following snippet of code defines a node filter that returns comment nodes but ignores all other nodes:

						
Class commentsOnlyFilter implements NodeFilter
{
    short acceptNode(Node n)
    {
        if (n instanceof Comment)
            return NodeFilter.FILTER_ACCEPT;
        else
            return NodeFilter.FILTER_SKIP;
    }
}

It's important to understand the difference between FILTER_SKIP and FILTER_REJECT. When walking a tree, if a filter returns FILTER_REJECT, the node will be rejected as well as all of its children. With FILTER_SKIP, the node will be rejected but its children will still be processed. For iterators FILTER_SKIP and FILTER_REJECT have the same behavior.

DOM Ranges

DOMII ranges behave in a fashion similar to what you would expect from a word processor or text editor. Ranges have what is termed a mark or start of range and an offset or end of range. DOMII ranges allow a number of logical operations to be performed on a Document object, such as adding a new element (insertNode()), deleting elements (deleteContents()), and copying elements (cloneRange()).

We create a range as follows:

					
Document d;
Range range = (DocumentRange)d.createRange();

After we have a range object, we then can set its start and end points using the following methods, all of which are from the Range interface:

• Range.setStartBefore(Node startNode) Sets the start of the range to be before the current node, including the current node.

• void setStartAfter(Node startNode) Sets the start of the range to be after the current node and not include the current node.

• void setEndAfter(Node endNode) Sets the end of the range to be after the current node, including the given node.

• void setEndBefore(Node endNode) Sets the end of the range to be before the endNode and not include the end node.

After we have a range of nodes, we can manipulate its content using the following:

• void deleteContents() Deletes all Nodes between the starting and ending points from the Document object.

• DocumentFragment extractContents() Creates a new DocumentFragment that represents the contents of the range. The extracted contents are deleted from the Document object.

• DocumentFragment cloneContents() Creates a new DocumentFragment that is a copy of the contents of the range. The original Document is unchanged.

• void InsertNode(Node new) Inserts the node into the range. The newly inserted node becomes the new start of the range.

Using range objects, we can manipulate the contents of a DOM tree easily using a graphical metaphor.