So far in this chapter, I've used the navigation methods such as nextSibling and nextChild to navigate through XML documents. However, you can also get individual elements by searching for them by name. Here's an example; in this case, I'll use the document object's getElementsByTagName method to return a node list object holding all elements of a given name. In particular, I'm searching for <FIRST_NAME> and <LAST_NAME> elements, so I get lists of those elements like this:
<HTML> <HEAD> <TITLE> Reading XML element values </TITLE> <SCRIPT LANGUAGE="JavaScript"> function loadDocument() { var xmldoc, listNodesFirstName, listNodesLastName xmldoc = new ActiveXObject("Microsoft.XMLDOM") xmldoc.load("meetings.xml") listNodesFirstName = xmldoc.getElementsByTagName("FIRST_NAME") listNodesLastName = xmldoc.getElementsByTagName("LAST_NAME")<HTML> . . .
Like all node lists, the listNodesFirstName and listNodesLastName node lists are indexed by number starting at 0, so the third element in these lists is element number 2, which you refer to as listNodesLastName.item(2). This means that I can find the first and last name of the third person. (Recall that I actually need the first child of the <FIRST_NAME> and <LAST_NAME> nodes, which is the text node inside those elements that holds the person's name, so I use the firstChild method here.)
<HTML> <HEAD> <TITLE> Reading XML element values </TITLE> <SCRIPT LANGUAGE="JavaScript"> function loadDocument() { var xmldoc, listNodesFirstName, listNodesLastName xmldoc = new ActiveXObject("Microsoft.XMLDOM") xmldoc.load("meetings.xml") listNodesFirstName = xmldoc.getElementsByTagName("FIRST_NAME") listNodesLastName = xmldoc.getElementsByTagName("LAST_NAME") outputText = "Third name: " + listNodesFirstName.item(2).firstChild.nodeValue + ' ' + listNodesLastName.item(2).firstChild.nodeValue messageDIV.innerHTML=outputText } </SCRIPT> </HEAD> <BODY> <CENTER> <H1> Reading XML element values </H1> <INPUT TYPE="BUTTON" VALUE="Get the name of the third person" ONCLICK="loadDocument()"> <P> <DIV ID="messageDIV"></DIV> </CENTER> </BODY> </HTML>
We've made some progress here and have been able to read in an XML document in various ways to access specific elements in the document. I'll move on to the next step now—accessing not just an element's text content, but also the element's attributes.