• 0

Using JavaScript to Read XML Node Text


Question

This should be simple, but I'm having some issues. If I have the following XML data:

<node id="containerNode">
   <node>One Node</node>
   <node>Another Node</node>
</node>

and I ask for

xmlhttp.responseXML.getElementsByTagName("span")[0].firstChild.data

Firefox returns "undefined." And I guess I understand why. But what if I need all XML within containerNode? Is there any way to pull it out? Thank you!

Link to comment
Share on other sites

6 answers to this question

Recommended Posts

  • 0

May I ask why you used "span" in the getElementsByTagName function. In any case try using nodeValue instead of data.

Some example:

XML Data:

<images>
	<image>
		<title>Image 1</title>
		<url>http://someurl/image1</url>
	</image>
	<image>
		<title>Image 2</title>
		<url>http://someurl/image2</url>
	</image>
	<image>
		<title>Image 3</title>
		<url>http://someurl/image3</url>
	</image>
</images>

JavaScript:

var docElement = xmlhttp.responseXML.documentElement;
var imgNodes = docElement.getElementsByTagName("image");

	// Get information of each image
	for(var i = 0; i < imgNodes.length; i++)
	{
		// Get image title
		var imageTitle = imgNodes[i].childNodes[1].firstChild.nodeValue;
		// Get image url
		var imageUrl = imgNodes[i].childNodes[3].firstChild.nodeValue;

		alert(imageTitle + " - " + imageUrl);
	}

Hope this helps.

Link to comment
Share on other sites

  • 0

Thank you, but I was actually trying to do something a little different. Using your example, what if I wanted everything within the <images> node in text form?

&lt;images&gt;
	&lt;image&gt;
		&lt;title&gt;Image 1&lt;/title&gt;
		&lt;url&gt;http://someurl/image1&lt;/url&gt;
	&lt;/image&gt;
	&lt;image&gt;
		&lt;title&gt;Image 2&lt;/title&gt;
		&lt;url&gt;http://someurl/image2&lt;/url&gt;
	&lt;/image&gt;
	&lt;image&gt;
		&lt;title&gt;Image 3&lt;/title&gt;
		&lt;url&gt;http://someurl/image3&lt;/url&gt;
	&lt;/image&gt;
&lt;/images&gt;

Link to comment
Share on other sites

  • 0

Well, I don't think there is a standardized DOM function that will do that for the XML DOM. If it was HTML, you could have used innerHTML, but this doesn't work on the XML DOM unfortunately.

Firefox has something called XMLSerializer. Google Chrome also implemented it, but IE doesn't have anything similar.

Example:

function getNodesAsText(objXML, nodeName)
{
	var docElement = objXML.documentElement;
	var allNodes = docElement.getElementsByTagName(nodeName);

	//Initialize new XMLSerializer
	var xmlSer = new XMLSerializer();

	var nodesText = "";
	// Convert each node into text
	for(var i = 0; i &lt; allNodes.length; i++)
	{
		nodesText += xmlSer.serializeToString(allNodes[i]);		
	}

	return nodesText;
}

Call:

getNodesAsText(xmlhttp.responseXML,"image")

The above call will return all the image tags from my XML data example.

Link to comment
Share on other sites

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.