Hello folks! welcome back to a new edition of our tutorial on XML DOM. In this tutorial, we are going to be studying about how to get the node value of an XML DOM object.
The xml DOM documents have a hierarchy of informational units called nodes. Node object has a property nodeValue, used to return the value of the element.
In the following sections, we are going to be discussing about -
The xml DOM documents have a hierarchy of informational units called nodes. Node object has a property nodeValue, used to return the value of the element.
In the following sections, we are going to be discussing about -
- Getting node value of an element.
- Getting attribute value of a node.
We used the node.xml in all of the following example as below -
<Company> <Employee category = "Technical"> <FirstName>Kennedy</FirstName> <LastName>Nkpara</LastName> <ContactNo>1234567890</ContactNo> <Email>kennedynkpara@xyz.com</Email> </Employee> <Employee category = "Non-Technical"> <FirstName>Stephanie</FirstName> <LastName>Francis</LastName> <ContactNo>1234667898</ContactNo> <Email>stephaniefrancis@xyz.com</Email> </Employee> <Employee category = "Management"> <FirstName>Justice</FirstName> <LastName>Douglas</LastName> <ContactNo>1234562350</ContactNo> <Email>justicedouglas@xyz.com</Email> </Employee> </Company>
READ: XML DOM | Navigation
Get Node Value
The getElementByTagName() method can return a NodeList of all the Elements in a document order with a given tag name.
Example
The below example is used to parse an xml document (node.xml) into XML DOM object, and then extract the node of the child node Firstname (index at 0) -
<!DOCTYPE html> <html> <body> <script> if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else{ xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET","/dom/node.xml",false); xmlhttp.send(); xmlDoc = xmlhttp.responseXML; x = xmlDoc.getElementsByTagName('FirstName')[0] y = x.childNodes[0]; document.write(y.nodeValue); </script> </body> </html>
Output
Now save this file as getnode_example.html on the server's path (this file and node.xml should be on the same path in your server). The output of the above example gives us the node value as Kennedy.
READ: XML DOM | Accessing
Get Attribute Value
Attributes are part of XML node element. A node element can have multiple unique attributes. Attributes define properties of a node element. An XML attribute is always a name-value pair. This value of attribute is called the attribute node.
The getAttribute() method can retrieve an attribute value by element name.
The getAttribute() method can retrieve an attribute value by element name.
Example
The below example is used to parse an xml document (node.xml) into XML DOM object, and then extracts the attribute value of the category Employee (index at 2) -
<!DOCTYPE html> <html> <body> <script> if (window.XMLHttpRequest) { xmlhttp = new XMLHttpRequest(); } else { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET","/dom/node.xml",false); xmlhttp.send(); xmlDoc = xmlhttp.responseXML; x = xmlDoc.getElementsByTagName('Employee')[2]; document.write(x.getAttribute('category')); </script> </body> </html>
Output
Save this file as get_attribute_example.html on the server's path (this file and node.xml should be on the same path in your server). The output of the above example gives us the attribute value as Management.
READ: XML DOM | Loading
Alright guys! This is where we are going to be rounding up for this tutorial post. In our next tutorial, we are going to be discussing about XML DOM Set Node.
Feel free to ask your questions where necessary and we will attend to them as soon as possible. If this tutorial was helpful to you, you can use the share button to share this tutorial.
Follow us on our various social media platforms to stay updated with our latest tutorials. You can also subscribe to our newsletter in order to get our tutorials delivered directly to your emails.
Thanks for reading and bye for now.
Feel free to ask your questions where necessary and we will attend to them as soon as possible. If this tutorial was helpful to you, you can use the share button to share this tutorial.
Follow us on our various social media platforms to stay updated with our latest tutorials. You can also subscribe to our newsletter in order to get our tutorials delivered directly to your emails.
Thanks for reading and bye for now.