Xml Dom

Front 1

What is the DOM?

Back 1

The DOM is a W3C (World Wide Web Consortium) standard.

The DOM defines a standard for accessing documents like XML and HTML:

"The W3C Document Object Model (DOM) is a platform and language-neutral interface that allows programs and scripts to dynamically access and update the content, structure, and style of a document."

Front 2

The DOM is separated into 3 different parts / levels:

Back 2

1)Core DOM - standard model for any structured document
2)XML DOM - standard model for XML documents
3)HTML DOM - standard model for HTML documents

Front 3

What is the XML DOM?

Back 3

The XML DOM is:

A standard object model for XML
A standard programming interface for XML
Platform- and language-independent
A W3C standard
The XML DOM defines the objects and properties of all XML elements, and the methods (interface) to access them.

In other words: The XML DOM is a standard for how to get, change, add, or delete XML elements.

Front 4

Which element is the first child, which is the last child, who are the subling

<bookstore>
<book category="cooking">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
</bookstore>

Back 4

In the XML , the <title> element is the first child of the <book> element, and the <price> element is the last child of the <book> element.

Furthermore, the <book> element is the parent node of the <title>, <author>, <year>, and <price> elements.

Front 5

he XML DOM views an XML document as a node-tree.

All the nodes in the tree have a relationship to each other.

The XML DOM Node Tree

The XML DOM views an XML document as a tree-structure. The tree structure is called a node-tree.

All nodes can be accessed through the tree. Their contents can be modified or deleted, and new elements can be created.

The node tree shows the set of nodes, and the connections between them. The tree starts at the root node and branches out to the text nodes at the lowest level of the tree:



The image above represents the XML file books.xml.

Node Parents, Children, and Siblings

The nodes in the node tree have a hierarchical relationship to each other.

The terms parent, child, and sibling are used to describe the relationships. Parent nodes have children. Children on the same level are called siblings (brothers or sisters).

In a node tree, the top node is called the root
Every node, except the root, has exactly one parent node
A node can have any number of children
A leaf is a node with no children
Siblings are nodes with the same parent
The following image illustrates a part of the node tree and the relationship between the nodes:



Because the XML data is structured in a tree form, it can be traversed without knowing the exact structure of the tree and without knowing the type of data contained within.

You will learn more about traversing the node tree in a later chapter of this tutorial.

First Child - Last Child

Look at the following XML fragment:

<bookstore>
<book category="cooking">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
</bookstore>
In the XML above, the <title> element is the first child of the <book> element, and the <price> element is the last child of the <book> element.

Furthermore, the <book> element is the parent node of the <title>, <author>, <year>, and <price> elements.

Back 5

if (window.XMLHttpRequest)
{
xhttp=new XMLHttpRequest();
}
else // IE 5/6
{
xhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("GET","books.xml",false);
xhttp.send();
xmlDoc=xhttp.responseXML;

Front 6

Internet Explorer uses the ___________ method to parse an XML string, while other browsers use the ______________.

Back 6

method to parse an XML string

DOMParser object

Front 7

Load an XML String

Back 7

if (window.DOMParser) {
parser=new DOMParser();
xmlDoc=parser.parseFromString(text,"text/xml");
}
else // Internet Explorer
{
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async=false;
xmlDoc.loadXML(text); }

Front 8

Access Across Domains

Back 8

For security reasons, modern browsers do not allow access across domains.

This means, that both the web page and the XML file it tries to load, must be located on the same server.

The examples on W3Schools all open XML files located on the W3Schools domain.

If you want to use the example above on one of your web pages, the XML files you load must be located on your own server.

Front 9

loadXMLDoc() Function

generally placed in <head>

Back 9

function loadXMLDoc(dname)
{
if (window.XMLHttpRequest)
{
xhttp=new XMLHttpRequest();
}
else
{
xhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xhttp.open("GET",dname,false);
xhttp.send();
return xhttp.responseXML;
}

Front 10

External JavaScript for loadXMLDoc()

file is called "loadxmldoc.js", and will be loaded in the head section of an HTML page. Then, the loadXMLDoc() function can be called from a script in the page.

Back 10

<html> <head>
<script type="text/javascript" src="loadxmldoc.js">
</script>
</head>
<body>
<script type="text/javascript">
xmlDoc=loadXMLDoc("books.xml");

code goes here.....

</script>
</body> </html>

Front 11

XML DOM Properties

Back 11

1)x.nodeName - the name of x
2)x.nodeValue - the value of x
x.parentNode - the parent node of x
3)x.childNodes - the child nodes of x
4)x.attributes - the attributes nodes of x

Front 12

XML DOM Methods

Back 12

1)x.getElementsByTagName(name) - get all elements with a specified tag name
2)x.appendChild(node) - insert a child node to x
3)x.removeChild(node) - remove a child node from x

Front 13

The JavaScript code to get the text from the first <title> element in books.xml:

Back 13

txt=xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue

After the execution of the statement, txt will hold the value "Everyday Italian"

Front 14

xmlDoc

Back 14

the XML DOM object created by the parser

Front 15

getElementsByTagName("title")[0]

Back 15

the first <title> element

Front 16

childNodes[0]

Back 16

the first child of the <title> element (the text node)

Front 17

nodeValue

Back 17

the value of the node (the text itself)

Front 18

getElementsByTagName exampe

Back 18

<script type="text/javascript">
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title");
document.write(x[2].childNodes[0].nodeValue);
</script>

Front 19

The getElementsByTagName() Method

Back 19

getElementsByTagName() returns all elements with a specified tag name.
---Syntax
node.getElementsByTagName("tagname");
---Example
The following example returns all <title> elements under the x element:
x.getElementsByTagName("title");

Front 20

x.getElementsByTagName("title");
Note that the example above only returns <title> elements under the x node. To return all <title> elements in the XML document use ????

Back 20

xmlDoc.getElementsByTagName("title");

Front 21

Node Types (3)

Back 21

The documentElement property of the XML document is the root node.

The nodeName property of a node is the name of the node.

The nodeType property of a node is the type of the node.

Front 22

Get the Value of an Element example

Back 22

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
txt=x.nodeValue;

Front 23

Change the Value of an Element example

Back 23

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
x.nodeValue="Easy Cooking";

Front 24

The nodeType property specifies the type of node.

nodeType is read only.

The most important node types are:

Back 24

Node Type
Element 1
Attribute 2
Text 3
Comment 8
Document 9

Front 25

DOM Attribute List (Named Node Map)

Back 25

The attributes property of an element node returns a list of attribute nodes.

This is called a named node map, and is similar to a node list, except for some differences in methods and properties.

A attribute list keeps itself up-to-date. If an attribute is deleted or added, the list is automatically updated.

Front 26

Traversing means ????

Back 26

means looping through or traveling across the node tree.

Front 27

Browser Differences in DOM Parsing

Back 27

nternet Explorer will NOT treat empty white-spaces, or new lines as text nodes, while other browsers will.

Front 28

Get an Attribute Value - getAttribute()

Back 28

getAttribute() method returns an attribute value.

following code retrieves the text value of the "lang" attribute of the first <title> element:
---Example
xmlDoc=loadXMLDoc("books.xml");
txt=xmlDoc.getElementsByTagName("title")[0].getAttribute("lang");
---Result
txt = "en"

Front 29

Get an Attribute Value - getAttributeNode()

Back 29

The getAttributeNode() method returns an attribute node.
The following code retrieves the text value of the "lang" attribute of the first <title> element:
---Example
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0].getAttributeNode("lang");
txt=x.nodeValue;
---Result
txt = "en"

Front 30

Remove an Element Node

Back 30

The removeChild() method removes a specified node.
When a node is removed, all its child nodes are also removed.
The following code fragment will remove the first <book> element from the loaded xml:
xmlDoc=loadXMLDoc("books.xml");

y=xmlDoc.getElementsByTagName("book")[0];

xmlDoc.documentElement.removeChild(y);

Front 31

Remove Myself - Remove the Current Node

Back 31

The removeChild() method is the only way to remove a specified node.

When you have navigated to the node you want to remove, it is possible to remove that node using the parentNode property and the removeChild() method:
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("book")[0];
x.parentNode.removeChild(x);

Front 32

Remove a Text Node

Back 32

removeChild() method can also be used to remove a text node:
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0];
y=x.childNodes[0];
x.removeChild(y);

Front 33

Clear a Text Node

Back 33

nodeValue property can be used to change or clear the value of a text node:
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
x.nodeValue="";

Front 34

Remove an Attribute Node by Name

Back 34

removeAttribute(name) method is used to remove an attribute node by its name.
removeAttribute('category')
The following code fragment removes the "category" attribute in the first <book> element:
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("book");
x[0].removeAttribute("category");

Front 35

Remove Attribute Nodes by Object

Back 35

The removeAttributeNode(node) method is used to remove an attribute node, using the node object as parameter.
Example: removeAttributeNode(x)
The following code fragment removes all the attributes of all <book> elements:
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("book");
for (i=0;i<x.length;i++) {
while (x[i].attributes.length>0) {
attnode=x[i].attributes[0];
old_att=x[i].removeAttributeNode(attnode); } }

Front 36

Replace an Element Node

Back 36

replaceChild() method is used to replace a node.

Front 37

Replace Data In a Text Node

Back 37

The replaceData() method is used to replace data in a text node.
The replaceData() method has three parameters:
offset - Where to begin replacing characters. Offset value starts at zero
length - How many characters to replace
string - The string to insert
---
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
x.replaceData(0,8,"Easy");

Front 38

nodeValue Property it is easier to replace the data in a text node using the nodeValue property.

Back 38

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];

x.nodeValue="Easy Italian";

Front 39

Create a New Element Node

Back 39

xmlDoc=loadXMLDoc("books.xml");

newel=xmlDoc.createElement("edition");

x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newel);

Front 40

Create a New Attribute Node

Back 40

xmlDoc=loadXMLDoc("books.xml");

newatt=xmlDoc.createAttribute("edition");
newatt.nodeValue="first";

x=xmlDoc.getElementsByTagName("title");
x[0].setAttributeNode(newatt);

Front 41

Create an Attribute Using setAttribute()

Back 41

Since the setAttribute() method creates a new attribute if the attribute does not exist, it can be used to create a new attribute.

Example

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName('book');
x[0].setAttribute("edition","first");

Front 42

createTextNode

Back 42

xmlDoc=loadXMLDoc("books.xml");

newel=xmlDoc.createElement("edition");
newtext=xmlDoc.createTextNode("first");
newel.appendChild(newtext);

x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newel);

Front 43

CDATA Section Node - createCDATASection()

Back 43

xmlDoc=loadXMLDoc("books.xml");

newCDATA=xmlDoc.createCDATASection("Special Offer & Book Sale");

x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newCDATA);

Front 44

appendChild

Back 44

The appendChild() method adds a child node to an existing node.

The new node is added (appended) after any existing child nodes.

Note: Use insertBefore() if the position of the node is important.

Front 45

Add a Node - appendChild()

Back 45

xmlDoc=loadXMLDoc("books.xml");

newel=xmlDoc.createElement("edition");

x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newel);

Front 46

Insert a Node - insertBefore()

Back 46

xmlDoc=loadXMLDoc("books.xml");

newNode=xmlDoc.createElement("book");

x=xmlDoc.documentElement;
y=xmlDoc.getElementsByTagName("book")[3];

x.insertBefore(newNode,y);

Front 47

Add a New Attribute

Back 47

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName('book');
x[0].setAttribute("edition","first");

Front 48

Add Text to a Text Node - insertData()

Back 48

The insertData() method inserts data into an existing text node.

The insertData() method has two parameters:

offset - Where to begin inserting characters (starts at zero)
string - The string to insert

Front 49

insertData()

Back 49

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];

x.insertData(0,"Easy ");

Front 50

Copy a Node

Back 50

cloneNode() method creates a copy of a specified node.

The cloneNode() method has a parameter (true or false). This parameter indicates if the cloned node should include all attributes and child nodes of the original node.

Front 51

XMLHttpRequest Object

Back 51

XMLHttpRequest object is used to exchange data with a server behind the scenes.
The XMLHttpRequest object is the developers dream, because you can:
1)Update a web page without reloading the page
2)Request data from a server after the page has loaded
3)Receive data from a server after the page has loaded
4)Send data to a server in the background

Front 52

Syntax for creating an XMLHttpRequest object:

Back 52

xmlhttp=new XMLHttpRequest();

Front 53

Old versions of Internet Explorer (IE5 and IE6) uses an ActiveX Object:

Back 53

xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

Front 54

To handle all modern browsers, including IE5 and IE6, check if the browser supports the XMLHttpRequest object. If it does, create an XMLHttpRequest object, if not, create an ActiveXObject:

Back 54

if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

Front 55

Send a Request To a Server

Back 55

To send a request to a server, we use the open() and send() methods of the XMLHttpRequest object:

xmlhttp.open("GET","xmlhttp_info.txt",true);
xmlhttp.send();

Front 56

GET or POST?

Back 56

GET is simpler and faster than POST, and can be used in most cases.

However, always use POST requests when:

A cached file is not an option (update a file or database on the server)
Sending a large amount of data to the server (POST has no size limitations)
Sending user input (which can contain unknown characters), POST is more robust and secure than GET

Front 57

Server Response

Back 57

get the response from a server, use the responseText or responseXML property of the XMLHttpRequest object.

responseText -get the response data as a string
responseXML - get the response data as XML data

Front 58

Document W3C node type

Back 58

Represents the entire document (the root-node of the DOM tree)
-----children-----
Element (max. one), ProcessingInstruction, Comment, DocumentType
--------
xmlDoc=loadXMLDoc("books.xml");
document.write("Nodename: " + xmlDoc.nodeName);
document.write(" (nodetype: " + xmlDoc.nodeType + ")<br />");
Element (max. one), ProcessingInstruction, Comment, DocumentType

Front 59

DocumentFragment W3C node type

Back 59

Represents a "lightweight" Document object, which can hold a portion of a document
----children----
Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference

Front 60

DocumentType W3C node type

Back 60

Provides an interface to the entities defined for the document

Front 61

EntityReference W3C node types

Back 61

EntityReference
------
Represents an entity reference
-----children----

Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference

Front 62

Attr

Back 62

Represents an attribute
----children----
Text, EntityReference

Front 63

Text

Back 63

Represents textual content in an element or attribute

Front 64

CDATASection

Back 64

Represents a CDATA section in a document (text that will NOT be parsed by a parser)

Front 65

Commend

Back 65

Represents a comment

Front 66

Notation

Back 66

Represents an entity
----children----
Element, ProcessingInstruction, Comment, Text, CDATASection, EntityReference

Front 67

Document Node type
nodeName returned
nodeValue returned

Back 67

nodeName returned - #document
nodeValue returned - null

Front 68

DocumentFragment Node type
nodeName returned
nodeValue returned

Back 68

nodeName returned - #document fragment
nodeValue returned - null

Front 69

DocumentType Node type
nodeName returned
nodeValue returned

Back 69

nodeName returned - doctype name
nodeValue returned - null

Front 70

EntityReference Node type
nodeName returned
nodeValue returned

Back 70

nodeName returned - entity reference name
nodeValue returned - null

Front 71

Element Node type
nodeName returned
nodeValue returned

Back 71

nodeName returned - element name
nodeValue returned - null

Front 72

Attr Node type
nodeName returned
nodeValue returned

Back 72

nodeName returned - attribute name
nodeValue returned - attribute value

Front 73

ProcessingInstruction Node type nodeName returned
nodeValue returned

Back 73

nodeName returned - target
nodeValue returned - content of node

Front 74

Text Comment Node type nodeName returned
nodeValue returned

Back 74

nodeName returned - #text
nodeValue returned - content of nde

Front 75

CDATASection Node type nodeName returned
nodeValue returned

Back 75

nodeName returned - #cdata-section
nodeValue returned - content of node

Front 76

Entity Node type
nodeName returned
nodeValue returned

Back 76

nodeName returned - entity name
nodeValue returned - null

Front 77

Notation Node type
nodeName returned
nodeValue returned

Back 77

nodeName returned - notation name
nodeValue returned - null

Front 78

Text Node type
nodeName returned
nodeValue returned

Back 78

nodeName returned - #text
nodeValue returned - content of node

Front 79

NodeType
1
2
3
4

Back 79

Named Constant
1 - ELEMENT_NODE
2 - ATTRIBUTE_NODE
3 - TEXT_NODE
4 - CDATA_SECTION_NODE

Front 80

NodeType
5
6
7
8

Back 80

5 - ENTITY_REFERENCE_NODE
6 - ENTITY_NODE
7 - PROCESSING_INSTRUCTION_NODE
8 - COMMENT_NODE

Front 81

NodeType
9
10
11
12

Back 81

9 - DOCUMENT_NODE
10 - DOCUMENT_TYPE_NODE
11 - DOCUMENT_FRAGMENT_NODE
12 - NOTATION_NODE

Front 82

previousSibling

Back 82

Returns the node immediately before a node

Front 83

parentNode

Back 83

Returns the parent node of a node

Front 84

ownerDocument

Back 84

Returns the root element (document object) for a node

Front 85

nodeValue

Back 85

Sets or returns the value of a node, depending on its type

Front 86

nodeType

Back 86

Returns the type of a node

Front 87

nodeName

Back 87

Returns the name of a node, depending on its type

Front 88

nextSibling
childNodes

Back 88

nextSibling - Returns the node immediately following a node
childNodes - Returns a NodeList of child nodes for a node

Front 89

lastChild
firstChild

Back 89

lastChild - Returns the last child of a node
firstChild - Returns the first child of a node

Front 90

removeNamedItem()

Back 90

Removes the specified node (by name)

Front 91

item()

Back 91

Returns the node at the specified index
-----
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName('book');
for(i=0;i<x.length;i++) {
att=x.item(i).attributes.getNamedItem("category");
document.write(att.value + "<br />"); }

Front 92

getElementsByTagName()

Back 92

Returns a NodeList of all elements with a specified name
-----
xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0]
y=x.childNodes[0];
document.write(y.nodeValue);

Front 93

getElementById(id)

Back 93

Returns the element that has an ID attribute with the given value. If no such element exists, it returns null

Front 94

createTextNode()
createElement()

Back 94

createTextNode() - Creates a text node
createElement() - Creates an element node

Front 95

createDocumentFragment()

Back 95

Creates an empty DocumentFragment object, and returns it

Front 96

createComment()

Back 96

Creates a comment node
----
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName('book');
var newComment,newtext;
newtext="Revised April 2008";
for (i=0;i<x.length;i++) {
newComment=xmlDoc.createComment(newtext);
x[i].appendChild(newComment); }

Front 97

XML DOM attributes Property

Back 97

The attributes property returns a NamedNodeMap (attribute list) containing the attributes of the selected node
If the selected node is not an element, this property returns NULL.

Front 98

XML DOM childNodes Property

Back 98

The childNodes property returns a NodeList containing the child nodes of the selected node
If the selected node has no children, this property returns a NodeList containing no nodes.
-------------------
xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0]
y=x.childNodes[0];
document.write(y.nodeValue);

Front 99

XML DOM firstChild Property

Back 99

The firstChild property returns the first child node of the selected element if the selected node has no children, this property returns NULL.

Front 100

XML DOM nextSibling Property function example

Back 100

//check if the next sibling node is an element node
function get_nextsibling(n)
{
x=n.nextSibling;
while (x.nodeType!=1)
{
x=x.nextSibling;
}
return x;
}

Front 101

XML DOM nodeName Property

Back 101

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0];
document.write(x.nodeName);

Front 102

XML DOM nodeType Property

Back 102

xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0];
document.write(x.nodeType);

Front 103

XML DOM ownerDocument Property

Back 103

he ownerDocument property returns the document object the selected element belongs to.
------------------------------------------
xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0];
x=x.ownerDocument;

document.write("Nodename: " + x.nodeName);
document.write(" (nodetype: " + x.nodeType + ")");

Front 104

XML DOM parentNode Property

Back 104

parentNode property returns the parent node of the specified element.
--------------------------------------------
xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0];
parent=x.parentNode;

document.write("Parent node: " + parent.nodeName);

Front 105

XML DOM previousSibling Property

Back 105

The previousSibling property returns the previous sibling node (the previous node in the same tree level) of the selected element
If there is no such node, this property returns null.
//check if the previous sibling node is an element node
function get_previoussibling(n) {
x=n.previousSibling;
while (x.nodeType!=1)
{ x=x.previousSibling; }
return x; }

Front 106

XML DOM tagName Property

Back 106

tagName property returns the tag name of the selected element.
--------------------------------------------
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("title")[0];
document.write(x.tagName);

Front 107

XML DOM appendChild() Method

Back 107

appendChild() method adds a node after the last child node of the specified element node.
----------------------------------------
xmlDoc=loadXMLDoc("books.xml");

newel=xmlDoc.createElement("edition");
x=xmlDoc.getElementsByTagName("book")[0];
x.appendChild(newel);
document.write(x.getElementsByTagName("edition")[0].nodeName);

Front 108

XML DOM cloneNode() Method

Back 108

The cloneNode() method creates an exact copy of a specified node.
-----------------------------------------
xmlDoc=loadXMLDoc("books.xml");
oldNode=xmlDoc.getElementsByTagName('book')[0];
newNode=oldNode.cloneNode(true);
xmlDoc.documentElement.appendChild(newNode);
//Output all titles
y=xmlDoc.getElementsByTagName("title");
for (i=0;i<y.length;i++) {
document.write(y[i].childNodes[0].nodeValue);
document.write("<br />"); }

Front 109

XML DOM getAttribute() Method

Back 109

getAttribute() method gets an attribute value by name.
-----------------------------------
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName('book');
for (i=0;i<x.length;i++) { document.write(x[i].getAttribute('category'));
document.write("<br />"); }

Front 110

XML DOM getAttributeNode() Method

Back 110

getAttributeNode() method gets an attribute node by name from the current element.
--------------------------------------------
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName('book');
for(i=0;i<x.length;i++) {
attnode=x.item(i).getAttributeNode("category");
document.write(attnode.name);
document.write(" = ");
document.write(attnode.value);
document.write("<br />"); }

Front 111

XML DOM hasAttribute() Method

Back 111

hasAttribute() method returns TRUE if the current element node has the attribute specified by name, and FALSE otherwise.
----------------------------------------
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("book")[0];

document.write(x.hasAttribute("category"));

Front 112

XML DOM hasAttributes() Method

Back 112

hasAttributes() method returns TRUE if the current element node has any attributes, and FALSE otherwise
-------------------------------
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName('book')[0];
document.write(x.hasAttributes());

Front 113

XML DOM hasChildNodes() Method

Back 113

The hasChildNodes() method returns TRUE if the current element node has child nodes, and FALSE otherwise.
---------------------------------
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName("book")[0];

document.write(x.hasChildNodes());

Front 114

XML DOM insertBefore() Method

Back 114

The insertBefore() method inserts a new child node before an existing child node.
This method returns the new child node.
-----------------------------------
xmlDoc=loadXMLDoc("books.xml");

newNode=xmlDoc.createElement("book");
x=xmlDoc.documentElement;
y=xmlDoc.getElementsByTagName("book")[3];
x.insertBefore(newNode,y);

Front 115

XML DOM removeAttribute() Method

Back 115

The removeAttribute() method removes a specified attribute.
If a default value for the attribute is defined in a DTD, a new attribute immediately appears with the default value
-----------------------------
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName('book');
document.write(x[0].getAttribute('category'));
document.write("<br />");
x[0].removeAttribute('category');
document.write(x[0].getAttribute('category'));

Front 116

XML DOM removeAttributeNode() Method

Back 116

The removeAttributeNode() method removes a specified attribute node.
If a default value for the attribute is defined in a DTD, a new attribute immediately appears with the default value.
This function returns the removed attribute node.
----------------------------
xmlDoc=loadXMLDoc("books.xml");
x=xmlDoc.getElementsByTagName('book');
for(i=0;i<x.length;i++) {
attnode=x.item(i).getAttributeNode("category");
old_att=x.item(i).removeAttributeNode(attnode);
document.write("Removed attribute: " + old_att.name + "<br />"); }

Front 117

XML DOM removeChild() Method

Back 117

The removeChild() method removes a child node.
--------------------------------------
xmlDoc=loadXMLDoc("books.xml");
y=xmlDoc.getElementsByTagName("book")[0];
x=xmlDoc.documentElement.removeChild(y);
document.write("Removed node: " + x.nodeName);

Front 118

XML DOM replaceChild() Method

Back 118

The replaceChild() method replaces a child node with another.
This function returns the replaced node on success, or NULL on failure.
-----------------------------------------
xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.documentElement;
//create a book element
newNode=xmlDoc.createElement("book");
y=xmlDoc.getElementsByTagName("book")[0]
//replace the first book node with the new node
x.replaceChild(newNode,y);

Front 119

XML DOM setAttributeNode() Method

Back 119

setAttributeNode() method adds a new attribute node.

If an attribute with that name already exists in the element, it is replaced by the new one. If the new attribute replaces an existing attribute, the replaced attribute node is returned, otherwise it returns null.