home HOME

XML DOM Tutorial
DOM HOME
DOM Introduction
DOM Nodes
DOM Node Tree
DOM Node Access
DOM Node Info
DOM Node List
DOM Parsing
DOM Traverse Nodes
DOM Mozilla vs IE
DOM Navigate Nodes

Manipulate Nodes
DOM Get Nodes
DOM Set Nodes
DOM Remove Nodes
DOM Replace Nodes
DOM Create Nodes
DOM Add Nodes
DOM Clone Nodes

XML DOM Reference
DOM Node Types
DOM Node
DOM NodeList
DOM NamedNodeMap
DOM Document
DOM DocumentImpl
DOM DocumentType
DOM ProcessingInstr
DOM Element
DOM Attribute
DOM Text
DOM CDATA
DOM Comment
DOM HttpRequest
DOM ParseError

DOM Summary

Examples
DOM Examples
DOM Validator

Selected Reading
Web Statistics
Web Glossary
Web Hosting
Web Quality

W3Schools Forum

Helping W3Schools

pixels

XML DOM Node List and NamedNodeMap

prev next

DOM Node List and NamedNodeMap

This chapter explains what a NodeList is, and what a NamedNodeMap is. It also explains the differences between them.


DOM Node List

When using properties or methods like childNodes or getElementsByTagName(), we receive a NodeList object.

A NodeList object represents an ordered list of nodes.

The nodes in the NodeList can be accessed through their index number (starting from 0).

Note: In a NodeList, the nodes are returned in the order in which they are specified in the XML.

Look at the following XML file: books.xml

We will now create a node list of all the <title> elements in "books.xml", by using the getElementsByTagName("title") method. The following image represents the node list returned:

DOM node list

The following code fragment gets the text from the first <title> element:

getElementsByTagName("title")[0].childNodes[0].nodeValue

Output:

Everyday Italian


Get the Length of a Node List

The node list keeps itself up-to-date. If an element is deleted or added, in the node list or the XML document, the list is automatically updated.

The node list has a useful property: length. The length property returns the number of nodes in a node list.

The following code fragment gets the number of <title> elements in "books.xml":

getElementsByTagName('title').length

Output:

4

When you know the length of a node list, you can easily loop through it and extract the values you want.

The following code fragment loops through all <title> elements and prints their values:

//the x variable will hold a NodeList
var x=getElementsByTagName('title')
for (i=0;i<x.length;i++)
  {
  document.write(x[i].childNodes[0].nodeValue)
  document.write("<br />")
  }

Output:

Everyday Italian
Harry Potter
XQuery Kick Start
Learning XML


DOM NamedNodeMap

When using the attributes property on an element, we receive a NamedNodeMap object.

A NamedNodeMap object represents an unordered list of attribute nodes.

The nodes in the NamedNodeMap can be accessed through their name.

Note: In a NamedNodeMap, the nodes are not returned in any particular order.


Get the Length of a NamedNodeMap

The NamedNodeMap keeps itself up-to-date. If an element is deleted or added, in the node list or the XML document, the list is automatically updated.

The NamedNodeMap also has a length property. The length property returns the number of nodes in the list.

Look at the following XML file: books.xml

The following code fragment gets the number of attributes in the first <title> element in "books.xml":

getElementsByTagName('title')[0].attributes.length

Output:

1


Get an Item's Value in a NamedNodeMap

The getNamedItem() method of the NamedNodeMap object can be used to retrieve a specified node.

The following code fragment shows how to print the value of the "category" attribute in each <book> element":

xmlDoc=loadXMLDoc("books.xml");
var x=xmlDoc.getElementsByTagName("book");
for(i=0;i<x.length;i++)
  {
  //the attlist variable will hold a NamedNodeMap
  var attlist=x.item(i).attributes;
  var att=attlist.getNamedItem("category");
  document.write(att.value + "<br />")
  }

Output:

COOKING
CHILDREN
WEB
WEB


prev next

Jump to: Top of Page or HOME or Printer Friendly Printer friendly page

W3Schools provides material for training only. We do not warrant the correctness of its contents. The risk from using it lies entirely with the user. While using this site, you agree to have read and accepted our terms of use and privacy policy.

Copyright 1999-2007 by Refsnes Data. All Rights Reserved.

Validate Validate W3C-WAI level A conformance icon W3Schools was converted to XHTML in December 1999