Contents
Overview 1
The DOM View of XML Documents 2
Accessing DOM Trees 9
Transforming XML with XSL
Programmatically 22
Lab 6.1: Transforming XML Data on the
Client 31
Working with Elements and Attributes 36
Lab 6.2: Manipulating XML Data on the
Client 49
Displaying XML Data Using DOM 57
Lab 6.3: Displaying XML Data Using DOM 65
Review 72

Module 6: Manipulating
XML Data on the Client
Using DOM Information in this document is subject to change without notice. The names of companies,
products, people, characters, and/or data mentioned herein are fictitious and are in no way intended
to represent any real individual, company, product, or event, unless otherwise noted. Complying
with all applicable copyright laws is the responsibility of the user. No part of this document may

Editor: Dennis Rae (Wasser)
Production Manager: Miracle Davis
Print Coordinator: Marlene Lambert (Online Training Solutions, Inc)
Build Manager: Julie Challenger
Build Coordinator: Jenny Boe
Test Lead: Eric Myers
Manufacturing Manager: John Williams
Group Product Manager: Steve Elston Module 6: Manipulating XML Data on the Client Using DOM iii Instructor Notes
This module shows how to use the Document Object Model (DOM) to access,
manipulate, modify, extend, and transform an XML document. This is a long
module, with three labs, so you can fully expect to spend a good deal of time on
this module. Take it easy, making sure that students understand the purpose as
well as the syntax of each topic.
The module uses client-side examples to illustrate the various aspects of DOM,
but you should point out that DOM can be used equally well on the server.
Students will use DOM on the server during Module 8, “Validating XML Data
Using Schemas.”
Before beginning this module, you should ask students if they are already
familiar with another object model. (Any object model will do.) Prior exposure
to an object model makes it much easier to understand issues such as
inheritance, methods and properties, and creating objects in Microsoft
VBScript.
You should also make it clear that the module describes DOM as supported by
Microsoft. This is an extension of the current W3C standard (DOM Level 1).

This section provides you with the required materials and preparation tasks that
you need to teach this module.
Required Materials
To teach this module, you need the following materials:
!
Microsoft PowerPoint
®
file 1905a_06.ppt
!
Module 6, “Manipulating XML Data on the Client Using DOM”
!
Lab 6.1, “Transforming XML Data on the Client”
!
Lab 6.2, “Manipulating XML Data on the Client”
!
Lab 6.3, “Displaying XML Data Using DOM”

Preparation Tasks
To prepare for this module, you should:
!
Read all of the materials for this module.
!
Complete the labs.
Due to the length of the answers to the labs for this course, we were unable
to include them in the Delivery Guide. Please see Appendix A or the
Student CD for the lab answers.
!
Review Microsoft’s implementation of the DOM. Go to the Web site
/> and click XML Developer’s Guide in the
Table of Contents, and then click XML DOM User Guide.

Technologies,” then again in more detail in Module 4, “Displaying an XML
Document Using XSL.”
This section shows how to apply a style sheet to an XML document
dynamically, so that the choice of style sheet can be made at run time.
!
Lab 6.1: Transforming XML Data on the Client
This lab asks students to apply a style sheet to the “book” data island in
order to transform it into a suitable format to add to the “order” data island.
The style sheet that performs the transformation has already been written —
students can use this style sheet as is, without modification.
!
Working with Elements and Attributes
This section extends the basic navigation capabilities introduced at the
beginning of the module, to show how to add, remove, and replace elements
and attributes in an XML document. The selectNodes and selectSingleNode
methods sometimes cause confusion, so deal carefully with these topics.
Another potential difficulty is the fact that an Element node does not
contain the value for the element — this is held in a child Text node.
!
Lab 6.2: Manipulating XML Data on the Client
This lab asks students to use DOM to add more details to the “order” data
island. There are many opportunities for students to go astray with the
syntax, so keep a close eye to make sure students don’t lose time with
simple syntax errors.
vi Module 6: Manipulating XML Data on the Client Using DOM !
Displaying XML Data Using DOM
This is the final section of a long module, so you need to be sensitive to the

Lab 6.2: Manipulating XML Data on the Client
!
Displaying XML Data Using DOM
!
Lab 6.3: Displaying XML Data Using DOM
!
ReviewIn Module 2, “Overview of XML Technologies,” you learned about the concept
of using the Document Object Model (DOM) to access an XML document
programmatically. In this module, you will learn the details of DOM
programming.
With the DOM, you can access an XML data island or load a new XML
document into memory from a file. Once the XML tree is in memory, you can
use the DOM objects, properties, and methods to parse, navigate, and
manipulate the XML document. You can also perform intelligent searches on
the XML data with DOM.
After completing this module, you will be able to:
!
List four XML DOM objects.
!
Identify the nodes of a DOM tree.
!
Retrieve information from a DOM tree.
!
Add, move, and remove nodes from a DOM tree.
!
Identify the limitations of XSL style sheet transformations.
!


In this section, you will learn about XML parsers and how they parse an XML
document into a tree structure in memory. You will also learn about the XML
Document Object Model (DOM), which allows XML data to be manipulated
programmatically.
For more information on Microsoft’s implementation of the DOM, go to
/>, click XML Developer’s Guide in the Table of
Contents, and then click XML DOM User Guide.
Slide Objective
To provide an overview of
the topics in this section
Lead-in
The XML parser creates a
tree structure to hold the
data in an XML document.
Trees are very flexible, and
the DOM is essentially a set
of interfaces that provide
methods and properties for
manipulating these trees.
Module 6: Manipulating XML Data on the Client Using DOM 3 Parsing XML Data
<?xml version="1.0"?>
<?xml-stylesheet href="…" type="text/xsl"?>
<booklist>
<book>
<title>Sushi, Anyone?</title>
<isbn>72-80081-024</isbn>

XML document, breaks the data into tokens according to certain rules, and
creates a new interpretation of the data as a tree structure in memory.
The parser requires a well-formed document as its input, and will reject any
document that does not conform to the basic rules of XML syntax.
Some parsers also perform validation checks on XML documents. A validating
parser will check the XML document against an attached XML schema or
DTD. The parser in Internet Explorer 5 is capable of performing validation
checks, but does not do so by default.

In addition to the parser provided in Internet Explorer 5, Microsoft also
provides an XML validation tool named Xmlint.exe, which can be used to
verify that an XML document is well formed. Xmlint.exe can be downloaded
from the following Web site:
/>.
The following is an example of how you can use Xmlint.exe from the command
line:
xmlint –w c:\myxmldata\*.xml

This command checks all the XML documents in the folder C:\myxmldata for
well-formedness. The “-w” flag indicates that the well-formedness check is
required.

Slide Objective
To describe the role of the
XML parser.
Lead-in
The XML parser is a tool
that transforms XML
documents into
programmable tree

The XML parser creates a tree to represent the data — parsing instructions,
elements, attributes, and so on — in an XML document. Items in the tree are
called nodes. The XML DOM defines a set of objects that allow the nodes in
the tree to be accessed or modified.
Document object
The top node (also known as the root node) of the tree is a Document object.
This node contains the entire contents of the XML document, including the
processing instructions, the root element, and all its child elements. The
Document object has properties and methods for creating new nodes (elements
and attributes) and adding them to the tree, and for manipulating the XML
document as a whole.
Element and Attr objects
Other nodes in the tree represent parts of the XML document. The nodes are
arranged in a hierarchy that reflects the structure of the XML document itself.
There are different types of DOM objects for manipulating nodes that represent
different parts of a document. For example, the Element object contains
methods and properties pertaining to XML elements. Likewise, the Attr object
contains methods and properties pertaining to XML attributes. (The W3C
named the object Attr rather than Attribute to avoid clashing with existing
Interface Definition Languages.)
Methods are available for inserting or removing a child node from any node in
the tree. This enables the underlying tree structure to be changed
programmatically.
Slide Objective
To discuss the reasons why
a tree structure is
appropriate for representing
XML data, and to introduce
the main DOM objects.
Lead-in

nodeValue, nodeType, nodeNameEvery ‘branch’ of the DOM tree is a Node object. It does not matter whether
the node is an element, an attribute, a simple piece of text, or the document
itself — the DOM defines a simple inheritance hierarchy with the Node object
as the root.
The Node object defines methods and properties that are common to all types
of nodes:
!
The firstChild, lastChild, nextSibling, and previousSibling methods
provide navigational support. For example, you can use these methods to
iterate through all of the child elements of an element.
!
The nodeValue, nodeType, and nodeName properties allow you to query
any node in the DOM tree and determine its value, type (for example, an
element or an attribute), and name (for example, the name of an element or
an attribute).

There are additional properties and methods, depending on what type of node
you are dealing with.
The nodeType property distinguishes one node type from another, as shown in
the following table.
Node NodeType property Value

Document NODE_DOCUMENT 9
Element NODE_ELEMENT 1
Attr NODE_ATTRIBUTE 2
Text NODE_TEXT 3


DOM levels
$
Level 1 — As described in this module
$
Level 2 — Level 1 + namespaces + style sheets
!
Microsoft’s implementation
$
All of Level 1
$
Much of Level 2
$
Additional features
DOM level 2
Internet
Explorer 5
DOM level 1The DOM levels specified by the W3C are well defined and documented. Level
1 is fixed and has formed the basis for most of the discussions in this module.
Level 2 adds support for XML namespaces and style sheets.

DOM Level 2 is rapidly approaching “Recommendation” status. More
details can be found at the Web site />.

Microsoft’s implementation
The Microsoft implementation of DOM supports DOM Level 1 in its entirety,
and much of Level 2. The Microsoft DOM also implements a small number of
additional interfaces, methods, and properties.

Navigating Elements in the DOM Tree
!
Navigating Node Collections
!
Retrieving Node Content
!
Demonstration: Retrieving Node ContentThis section introduces the DOM, its main objects, and some of their methods
and properties. You will learn how to retrieve data from an XML document
programmatically, and how to navigate the tree in order to access various data
items in a document.
Slide Objective
To provide an overview of
the topics in this section.
Lead-in
So far you have looked at
the general concepts of
DOM. Next you will be
shown some specific
examples of accessing
individual data items from
the DOM tree.
10 Module 6: Manipulating XML Data on the Client Using DOM Accessing XML Data
!
Access an XML data island

The first step is to create an XML DOM object by using the CreateObject
method of VBScript as follows:
Set doc = CreateObject("Microsoft.XMLDOM")

Slide Objective
To access a DOM document
and its underlying data from
an XML Data Source Object
(DSO) or external file.
Lead-in
Before you can access the
nodes in the XML
document, you must
programmatically retrieve
the DOM document
interface from a DSO or an
XML document file.
Module 6: Manipulating XML Data on the Client Using DOM 11 Set the async property
Next, set the async property to False to indicate that the XML document should
not to be loaded asynchronously. The default value of the async property is
True.
You can then use the readyState property to check the status of the download.
You can also attach an onreadystatechange event handler to be notified when
the ready state changes so that you know when the download is complete.
For more information on the async property, see the XML DOM Reference at

.

To access the XML data in any node,
use the xml property
$
For example, obtain the XML data for the root node
Set doc = dsoDetails.XMLDocument
Set rootNode = doc.documentElement
Set doc = dsoDetails.XMLDocument
Set rootNode = doc.documentElement
MsgBox rootNode.xml
MsgBox rootNode.xmlOnce you have a reference to the Document object of a DOM tree, you can
access the root node of the document with the documentElement property as
follows:
Set doc = dsoDetails.XMLDocument
Set rootNode = doc.documentElement

Viewing the XML data
Microsoft DOM defines an xml property in the Node object. This property can
be used on any node to retrieve the XML data contained in that portion of the
DOM tree.
For example, the following code displays the entire XML document, including
any processing instructions:
MsgBox dsoDetails.XMLDocument.xml

The next example displays the XML from the root node on down:
MsgBox dsoDetails.XMLDocument.documentElement.xml

Slide Objective

!
ownerDocument returns a reference to the top-level Document node.
It is possible to access the Document node from any other node in the DOM
tree by using the ownerDocument property as follows:
Set doc = thenode.ownerDocument

!
parentNode returns a reference to a node’s parent node.
!
childNodes returns a collection of child nodes. The collection is zero-based.
The first child node is childNodes(0), the second child node is
childNodes(1), and so on.
!
nextSibling and previousSibling reference the next and previous nodes in a
collection of child nodes.
!
firstChild and lastChild reference the first and last child nodes.

Slide Objective
To introduce methods and
properties used to navigate
within the DOM tree.
Lead-in
Once the DOM tree has
been generated, you can
find elements by using Node
properties.
Delivery Tip
The slide is animated to
progressively display node

<price>19.99</price>
</book>
</booklist>
</xml>

The following code declares a variable named theNode and sets it to the second
<book> element, Sushi Anyone?.
Set theNode = _
dsoBooks.XMLDocument.documentElement.childNodes(1)

The following examples show how to navigate the DOM tree relative to this
node:
!
theNode.ownerDocument refers to the XML document itself.
!
theNode.previousSibling refers to the first <book> element, The Gourmet
Microwave.
!
theNode.nextSibling refers to the third <book> element, Straight Talk
About Computers.
!
theNode.parentNode refers to the <booklist> element.
!
theNode.parentNode.firstChild refers to the first <book> element, The
Gourmet Microwave.
!
theNode.parentNode.lastChild refers to the last <book> element, Straight
Talk About Computers.
!
theNode.childNodes refers to the collection of child elements of the current

The NodeList object is typically used to navigate through elements by using an
indexed loop. For example, the following code will iterate through all child
elements of the root element:
Set doc = dsoDetails.XMLDocument
Set rootNode = doc.documentElement

For Each child in rootNode.childNodes
'Access data in child node
Next

You can also use the item property of the NodeList collection to access specific
items in the collection. The following example is equivalent to the preceding
one, and accesses each child element of the root element:
Set doc = dsoDetails.XMLDocument
Set rootNode = doc.documentElement

Set children = rootNode.childNodes
For i = 0 To children.length - 1
'Access data in children.item(i)
Next

Slide Objective
To use the collection objects
in DOM.
Lead-in
DOM collections are
returned by several methods
and properties. These
collections contain nodes
that hold logically connected

MsgBox rootNode.nodeName
Set price = rootNode.firstChild.childNodes(1)
Set priceValue = price.firstChild
MsgBox priceValue.nodeValue
9
1
booklist
9.95Once a node has been referenced, its details can be accessed and manipulated
by using specific properties. The W3C-standard Node object defines three
properties, which can be used to find out information about any type of node:
!
nodeType is the type of the node, expressed as a number. For example, the
nodeType of the document is 9, the nodeType of an element is 1, and the
nodeType for an attribute is 2.
!
nodeName is the name of the node, such as the name of an element or an
attribute.
!
nodeValue is value of the node, such as the value of a text node or an
attribute.

Slide Objective
To access the data in the
nodes of the DOM tree.
Lead-in
Once you have navigated to
the node you want, use

following script accesses the XML data island and then retrieves the nodeType
of that node. The message box displays the value 9, indicating a node of the
type NODE_DOCUMENT.
Set doc = dsoDetails.XMLDocument
MsgBox doc.nodeType

The following script then accesses the documentElement property of the XML
data island, which returns the root element, for example, the <booklist>
element. The nodeType of this node is retrieved, and the message box displays
1 as the retrieved value. The value 1 indicates a node of the type
NODE_ELEMENT.
Set rootNode = doc.documentElement
MsgBox rootNode.nodeType

The nodeName property
The nodeName property of a node returns the identifier of the node. For
example, the nodeName of an element is the name of the element without the
angular brackets <>. Likewise, the nodeName of an attribute is the name of the
attribute.
The following script displays the identifier of the root element, which is
“booklist”:
MsgBox rootNode.nodeName

Module 6: Manipulating XML Data on the Client Using DOM 19 The nodeValue property
The nodeValue property of a node contains the value of a node. The nodeValue
of an attribute contains the value of the attribute. However, the nodeValue of an
element is null — the text content of an element is held in a child node of the

Set doc = dsoDetails.XMLDocument
MsgBox doc.nodeTypeString

The following script then accesses the documentElement property of the XML
data island, which returns the root element. The nodeTypeString of this node is
“element”, indicating a node of the type NODE_ELEMENT.
Set rootNode = doc.documentElement
MsgBox rootNode.nodeTypeString