PDA

View Full Version : AJAX and childNodes[]



Sammo
January 24th, 2006, 06:51 AM
Hey, I've been trying to get the grips with some basic ajax, but i'm having some problems. I can't seem to get childNodes to ever work.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" language="javascript">
function makeRequest(url, e) {
elem = document.getElementById(e);
elem.innerHTML = "Loading...";
if (window.XMLHttpRequest) {
http_request = new XMLHttpRequest();
} else if (window.ActiveXObject) {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}
if (!http_request) {
alert('Giving up :( Cannot create an XMLHTTP instance');
return false;
}
http_request.onreadystatechange = outContent;
http_request.open('GET', url, true);
http_request.send(null);
}
function outContent() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
var xmldoc = http_request.responseXML;
var root_node = xmldoc.getElementsByTagName('root');
elem.innerHTML = root_node[0].childNodes[0].firstChild.text;
} else {
elem.innerHTML = 'There was a problem with the request.';
}
}
}
</script>
</head>
<body>
<span style="cursor: pointer; text-decoration: underline" onclick="makeRequest('test.xml', 'load')">
Make a request
</span>
<div id="load"></div>
</body>
</html>

This is the code I'm using, and it's called this file:
<?xml version="1.0" ?>
<root>
<text>I'm a test.</text>
</root>

If I run the hasChildNodes() function it returns true, and I can get the tagName variables of the root tag, but whenever I throw a childNodes into it all I see is "Loading..." with no output of the data.

λ
January 24th, 2006, 11:52 AM
It looks to me like you're encoutering the problem that the whitespace between the root node and the text node is a node itself..

If the XML is represented as a tree, this is what it looks like:



root
- #text (\n\t)
- text
- #text (I'm a test.)
- #text (\n)

Try childNodes[1] instead :) And just so you know, you wouldn't normally use innerHTML with AJAX.

Sammo
January 24th, 2006, 02:07 PM
you wouldn't normally use innerHTML with AJAX.

I'm still learning JS here, but would you use appendChild instead?

antizip
January 24th, 2006, 02:23 PM
you could use appendChild but you're problem is still in referencing the opened XML ... I had this problem too, but I figured out it was browser specific. And by this I mean IE and everything else. I can't remember which did which but one reads that empty text node the other doesn't.

I think this is right ... if not then ignore me :)

Sammo
January 24th, 2006, 02:29 PM
is there an
myXML .ignoreWhite in js as there is in flash?

λ
January 24th, 2006, 03:16 PM
No, there isn't.. Normally, you'd get around that by looping over childNodes and using nodeName to check whether the node is the one you want. And yes, you'd normally use the DOM functions, of which appendChild is one.

antizip
January 24th, 2006, 05:05 PM
I found this page http://karaszewski.com/tools/ajaxlib/ which is a couple of JS functions that recursively strips white space from XML ...

Seems pretty simple and straight forward