Working with the XML Document Object Model ©NIITeXtensible Markup Language/Lesson 7/Slide 1 of 44 Objectives In this lesson, you will learn to: *Identify

Working with the XML Document Object Model

©NIIT eXtensible Markup Language/Lesson 7/Slide 1 of 44

Objectives

In this lesson, you will learn to:

Identify the need for XML Document Object Model (DOM)

Use the following XML DOM objects to access different parts of an XML document:

DOMDocument

IXMLDOMNode

IXMLDOMNodeList

IXMLDOMParseError



The XML Document Object Model The Document Object Model (DOM) defines the logical structure of documents and the way a document is accessed and manipulated. It provides an Application Programming Interface (API) for XML and HTML documents.

XML DOM views an XML document as being composed of objects. Each object has properties and behavior that can be manipulated using the methods provided by a DOM interface.



The XML Document Object Model (Contd.)

Using XML DOM, programmers can create and build XML documents, navigate the structure of documents, and add, modify, or delete elements and their content.

The objects and methods provided by XML DOM can be used with any programming language, such as Java, C++, and Visual Basic. These objects can also be used with scripting languages, such as VBScript and JavaScript.

To be able to use the features of XML DOM, you need to use a DOM-enabled parser.



The XML Document Object Model (Contd.)

A DOM-enabled parser reads an XML document and parses it to ensure that it is a valid document. Then, it creates an in-memory representation of the XML document by organizing its contents in a logical tree-structure. The tree-structure is made up of nodes.

MSXML is an example of a DOM-enabled XML parser.



Implementation of DOM in the MSXML Parser When the MSXML parser loads an XML document, it

reads the document and creates a tree structure that represents the various components of the XML document.



Implementation of DOM in the MSXML Parser(Contd.)

The following diagram depicts how DOM allows applications to access information stored in XML documents:

XMLDocument

MSXML Library

ParsedDocument

ParserDOM TreeRoot

Childtext

Childtext

Application



Tree structure of a Document

The basic building block of the tree structure is the node.

Nodes are generic containers that hold information about the elements, attributes, content, comments, and processing instructions that are stored in an XML document.

The XML document can be viewed as a single node that contains all the other nodes.



Tree structure of a Document

Every component of the XML document is represented as a node in the DOM tree-structure.

Each node has a name, type, and value associated with it. The name of the node is the name of the component with which the node is associated. The type of the node depends on the type of the component it represents.

DOM treats each of these nodes as objects. Therefore, it is possible to create a script that loads an XML document, traverses through all nodes, and displays the required information to the user.



XML DOM Objects and Methods

The main objects and methods provided by XML DOM that enable you to traverse, read, and manipulate the structure and content of an XML document are listed below:

The DOMDocument object

The IXMLDOMNode object

The IXMLDOMNodeList object

The IXMLDOMParseError object



The DOMDocument object

The DOMDocument object is the top-level object in XML DOM. It implements all the basic DOM methods required to work with an XML document. It also has methods, which support XSLT.

This object is associated with various methods that help you navigate, query, and modify the content and the structure of an XML document.



The DOMDocument object (Contd.)

Some of the most commonly used methods of the DOMDocument object are:

createElement(elementname): Creates an element node.

createAttribute(attributename): Creates an attribute node.

CreateNode(type, name, namespace-URI): Creates a node of the specified type. Also supports namespace URI.

getElementsByTagName(elementname): Returns a collection of element nodes that have the specified element name.



The DOMDocument object (Contd.) load(XMLdocument): Loads the specified XML

document.

appendChild(child node): Appends the specified child node to the document.

save(destination): Saves the XML document represented by the DOMDocument object at the specified destination.

Some of the commonly used properties of the DOMDocument object are:

async: Allows you to specify whether the XML document can be loaded asynchronously.

childNodes: Returns a list of child nodes.

firstChild: Returns the first child in the document.



The DOMDocument object (Contd.)

readyState: Returns the information about the state of the XML document (loading, loaded, interactive, complete).

parseError: Returns an object of IXMLDOMParseError, which can be used to retrieve error information.

xml: Returns the XML representation of a node.

validateOnParse: Specifies whether the parser should check for validity of an XML document.



Creating a DomDocument object

The following is the code segment written using JavaScript to create an instance of the DOMDocument object:

var myxmldoc = new ActiveXObject("Msxml2.DOMDocument.4.0");

A reference to the newly created object is stored in the variable myxmldoc, which can be used to load and manipulate XML documents.



Loading an XML file

To load an XML file by using a URL, you can write the following code in JavaScript :

myxmldoc.load("http://www.sb.com/employee.xml");

The load() method can also be used to load a file from the local host by providing the path, as shown in the following example:

myxmldoc.load("c:\examples\employees.xml");



Loading an XML file (Contd.)

To load an XML document synchronously, you can write the following code in JavaScript:


myxmldoc.async=false;

myxmldoc.load("employee.xml");



Using the readyState Property

To check if the document has been loaded completely, you can use the readyState property. The readyState property holds a numeric value, which represents one of the following states:

LOADING (1): This state indicates that the loading process is in progress and data is not yet parsed.

LOADED (2): This state indicates that data has been read and parsed but the object model is not yet ready.



Using the readyState Property (Contd.)

INTERACTIVE (3): This state indicates that the object model is available with partially retrieved data set and is in the read-only mode.

COMPLETED (4): This state indicates that the loading process is complete.



Creating a New Node

You can create a new node by using the createNode() method.

The following is the code segment to create a root element by using the createNode() method:


if (myxmldoc.childnodes.length==0)

{

myroot=myxmldoc.createNode(1,"ORDERDETAILS"," ");

myxmldoc.appendChild(myroot);

myxmldoc.save(myxmldoc.XMLDocument);

}



Creating New Elements

You can create new elements for the document by using the createElement() method of the myxmldoc DOMDocument object. The createElement() method takes one parameter, the name of the element that is to be created.

The following example creates a new element node called “salary”:

var xmlelement;

xmlelement=myxmldoc.createElement("salary");



Accessing Elements From an XML File

To access the elements from an XML document, you can begin at the root element and navigate through the document tree. You can also query for a specific node or nodes.

To reach a particular node or nodes within the document tree structure, you can use the getElementsByTagName() method.



The IXMLDOMNode object

The IXMLDOMNode object represents a node in the XML document tree structure.

The node could be an element that contains child elements.

The IXMLDOMNode object provides methods to work with child elements.

Some commonly used methods of the IXMLDOMNode object are:

appendChild(newchild): Appends a new child to the node.

insertBefore(newNode, refNode): Inserts a new node before the specified node.

removeChild(nodeName): Removes the specified node.



The IXMLDOMNode object (Contd.)

replaceChild(newNode, oldNode): Replaces the oldNode with newNode.

hasChildNodes(): Specifies whether the node has child nodes.

cloneNode(boolean): Creates a clone of the node represented by the IXMLDOMNode object.

Some of the commonly used properties of the IXMLDOMNode object are:

nodeName: Returns the name of the node.

nodeType: Specifies the type of the node.

nodeValue: Returns the text contained in the node.

childNodes: Returns the child nodes of the node.



The IXMLDOMNode object (Contd.)

firstChild: Returns the first child of the node.

lastChild: Returns the last child of the node.

text: Returns the text contained in the node.

xml: Returns the XML code for the node.



Accessing Text Values of Elements

The text enclosed within the tags in an XML file is used as a node value in DOM. A node value can be the value of an attribute or the text within an element.

You can display the text within the elements or attributes by using the text property, as shown below:

alert(myelement.text);

You can also set the value of an element by using this property, as shown in the example given below:

myelement.text=“Barbie Doll”;



Appending a New Child Node

The following code segment creates a new element by using the createElement() method of the DOMDocument object. Then, it appends the newly created node to the last child of myelement by using the appendchild() method:

var myelement=myxmldoc.documentElement;

var newElement=myxmldoc.createElement ("lastchild");

myelement.appendChild(newElement);



Inserting a Node Before Two Existing Nodes

The following code segment creates a new element called department and replaces and existing node with the new element:

var newElement= myxmldoc.createElement ("department");

var oldElement=myxmldoc.documentElement.childNodes.item(0).firstChild;

myxmldoc.documentElement.childNodes.item(1).insertBefore(newElement, oldElement);



Removing a Child Node

The following code segment removes a child node by using the removeChild() method:

var oldElement=myxmldoc.documentElement.childNodes.item(0).firstChild;

myxmldoc.documentElement.childNodes.item(0).RemoveChild(oldElement);



Replacing a Node (Contd.)

In the following example, the second element in the document is replaced with the new element named department:

Var newElement= myxmldoc.createElement("department");

Var oldElement=myxmldoc.documentElement.childNodes.item(0).firstChild;

myxmldoc.documentElement.childNodes.item(1).replaceChild(newElement, oldElement);



The IXMLDOMNodeList object

The IXMLDOMNodeList object enables you to iterate through a collection of nodes.

Some methods of the IXMLDOMNodeList object are:

item(number):Returns the node at the position indicated by the specified number.

nextNode(): Returns the next node in the list.

To obtain the length of the node list, use the length property. The length property can also be used to traverse through the list of child nodes.



The IXMLDOMNodeList object (Contd.)

The following code traverses through the child nodes of myelement:

var myelement=myxmlDoc.getElementsByTagName("emp");

for(i=0;i< myelement.length –1;i++)

alert(myelement.item(i).xml);



The IXMLDOMParseError Object

The IXMLDOMParseError object returns information about the most recent parse error.

The IXMLDOMParseError object provides properties to retrieve information, such as the error code, the error text, and the line that caused the error.



The IXMLDOMParseError Object (Contd.)

The properties of the IXMLDOMParseError object are:

errorCode: Returns the error code.

reason: Returns a string explaining the reason for the error.

line: Returns the line number where the error occurred.

linePos: Returns the position in the line where the error occurred.

srcText: Returns a string containing the line that caused the error.



Using the IXMLDOMParseError object

You can use the IXMLDOMParseError object to display information about the errors that are encountered while parsing an XML document.

Consider the following example:

var prodxml = new ActiveXObject("Msxml2.DOMDocument.4.0");prodxml.async = false;

prodxml.load("product.xml");

if (prodxml.parseError.errorCode != 0)

{ alert("A parse error occurred.");} else

{alert(prodxml.documentElement.xml);}



Problem Statement 7.D.1 The product details of CyberShoppe are stored in an

XML document. The structure of the XML document is defined in a DTD. The data held in the XML document must be validated against the rules specified for the data store.



Task List

Identify a mechanism to access an XML document programmatically.

Identify the objects required to access the XML document.

Write the code to access the document.

Execute the code.



Task 1: Identify a mechanism to access an XMLdocument programmatically.

Result:

The contents of an XML document can be accessed and manipulated from any application by using XML DOM. Therefore, to access an XML document programmatically, the best solution is to use XML DOM. Applications developed using VBScript, JavaScript, C/C++, or Visual Basic can use XML DOM objects.



Task 2: Identify the objects required to accessthe XML document.

Result:

You can validate the contents of an XML document against a DTD by using the following XML DOM objects:

DOMDocument

IXMLDOMParseError



Task 3: Write the code to access the document

To write a script that validates an XML document against the DTD, you need to follow the steps given below:

Create the user interface for accepting the XML file name.

Write the script to load the named XML document.

Write the script to validate the XML document against the DTD.



Task 4: Execute the script



Just a Minute…

The details about products sold at CyberShoppe are stored in an XML document called product.xml. Write the code to display the price of all products by using DOM objects.



Summary

In this lesson, you learned that:

DOM is an application programming interface that enables an application to access the contents of an XML document.

DOM objects enable you to access and manipulate XML documents.

When the MSXML parser loads an XML document, it creates a tree structure that represents the various components of the XML document.



Summary (Contd.)

The basic building block of the tree structure is a node. A node is a container that holds information about the elements, attributes, and content stored in an XML document.

Some XML DOM objects that are used to manipulate data in a document are:

DOMDocument

IXMLDOMNode

IXMLDOMNodeList

IXMLDOMParseError



Summary (Contd.)

The DOMDocument object is the top-level object in XML DOM. This object provides various properties and methods that help you to navigate, query, and modify the content and structure of XML documents.

The IXMLDOMNode object represents a node in the XML document structure. This object provides methods to work with child elements.

The IXMLDOMNodeList object enables you to iterate through a collection of nodes.

The IXMLDOMParseError object returns information about the most recent error.

Documents

Working with the XML Document Object Model ©NIITeXtensible Markup Language/Lesson 7/Slide 1 of 44 Objectives In this lesson, you will learn to: *Identify