DOM get node

XML DOM Get the node value

The nodeValue attribute is used to get the text value of the node.

getAttribute() method returns the value of the attribute.

Get the value of an element

In the DOM, each component is a node. Element nodes have no text value.

The text of element nodes is stored in child nodes. This node is called a text node.

The way to get the element text is to get the value of this child node (text node).

Get element values

The getElementsByTagName() method returns a node list containing all elements with the specified tag name, in which the elements are in the order they appear in the source document.

The following code loads "books.xml" into xmlDoc and retrieves the first <title> element using loadXMLDoc():

##xmlDoc=loadXMLDoc("books .xml");

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

The childNodes property returns a list of child nodes. The <title> element has only one child node. It is a text node.

The following code retrieves the text node of the <title> element:

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

y=x.childNodes [0];

nodeValue property returns the text value of the text node:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p>你好世界!</p>
<div id="main">
<p> DOM 是非常有用的。</p>
<p>该实例展示了  <b>getElementsByTagName</b> 方法</p>
</div>
<script>
var x=document.getElementById("main");
var y=x.getElementsByTagName("p");
document.write('id="main"元素中的第一个段落为：' + y[0].innerHTML);
</script>

</body>
</html>

Running instance »Click the "Run Instance" button to view the online instance

Result: txt = "Everyday Italian"

Traverse all <title> elements:

Try it

Get the value of the attribute

In the DOM, attributes are also nodes. Unlike element nodes, attribute nodes have text values.

The way to get the value of an attribute is to get its text value.

This task can be accomplished by using the getAttribute() method or the nodeValue attribute of the attribute node.

Get attribute value - getAttribute()

getAttribute() method returns attribute

value.

The following code retrieves the text value of the "lang" attribute of the first <title> element:

Example

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName('book');
for (i=0;i<x.length;i++)
{
document.write(x[i].getAttribute('category'));
document.write("<br>");
} 
</script>
</body>
</html>

Run instance»Click the "Run instance" button to view the online instance

Result: txt = "en"

Explanation of examples:

Use loadXMLDoc() to load "books.xml" into xmlDoc
Set the txt variable to the value of the "lang" attribute of the first title element node

Traverse all <book> elements and get their "category" attribute: Try it

Get the attribute value - getAttributeNode()

getAttributeNode() method returns the attributenode.

The following code retrieves the text value of the "lang" attribute of the first <title> element:

Example

<!DOCTYPE html>
<html>
<head>
<script src="loadxmldoc.js"> 
</script>
</head>
<body>

<script>
xmlDoc=loadXMLDoc("books.xml");

x=xmlDoc.getElementsByTagName("title")[0].getAttributeNode("lang");
txt=x.nodeValue;
document.write(txt);
</script>
</body>
</html>

Run Example»

Click the "Run Example" button to view the online example

Result: Result: txt = "en"

Explanation of the example:

Use loadXMLDoc() to load "books.xml" into xmlDoc
Get the "lang" attribute of the first <title> element node Node
Set the txt variable to the value of the attribute

Traverse all <book> elements and get their "category" attribute: try it

← DOM navigation

DOM change node →