Load an XML File - Cross-browser

shaggykyle · 10-12-2011, 08:34 PM

So I was reading up on how to load and parse an XML file into an html page and I found through w3 a great tutorial with sample code:

http://www.w3schools.com/xml/xml_dom.asp

It appears to work fine on their website but when I try it from my desktop it doesn't work. So what I have is an html file with contents:

Code:

<html>
<body>
<h1>W3Schools Internal Note</h1>
<div>
<b>To:</b> <span id="to"></span><br />
<b>From:</b> <span id="from"></span><br />
<b>Message:</b> <span id="message"></span>
</div>

<script type="text/javascript">
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.open("GET","note.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;

document.getElementById("to").innerHTML=
xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;
document.getElementById("from").innerHTML=
xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;
document.getElementById("message").innerHTML=
xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;
</script>

</body>
</html>

And then the xml file named "note.xml":

Code:

<note>
  <to>Tove</to>
  <from>Jani</from>
  <heading>Reminder</heading>
  <body>Don't forget me this weekend!</body>
</note>

I have no idea what I am missing or not seeing that is causing this not to work but if anyone knows I would appreciate the input. For the record I have tried this in chrome and ie.

DaveyErwin · 10-12-2011, 09:56 PM

There are two reasons why
the code you posted will not
work with IE on the file system.
It does work with Firefox,
the following code works with
firefox and IE, as long as you
have note.xml on your desktop
with the htm file .

Code:

<html>
<body>
<h1>W3Schools Internal Note</h1>
<div>
<b>To:</b> <span id="to"></span><br />
<b>From:</b> <span id="from"></span><br />
<b>Message:</b> <span id="message"></span>
</div>

<script type="text/javascript">

var xmlhttp=false;
var ie = false;
/*@cc_on @*/
/*@if (@_jscript_version >= 5)
 ie=true;
 try {
  xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
 } catch (e) {
  try {
   xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
  } catch (E) {
   xmlhttp = false;
  }
 }
@end @*/
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
	try {
		xmlhttp = new XMLHttpRequest();
	} catch (e) {
		xmlhttp=false;
	}
}
if (!xmlhttp && window.createRequest) {
	try {
		xmlhttp = window.createRequest();
	} catch (e) {
		xmlhttp=false;
	}
}
  
xmlhttp.open("GET","note.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
if(ie){
xmlDoc = new ActiveXObject ("microsoft.xmldom");
xmlDoc.loadXML(xmlhttp.responseText); 
}


document.getElementById("to").innerHTML=
xmlDoc.getElementsByTagName("to")[0].childNodes[0].nodeValue;
document.getElementById("from").innerHTML=
xmlDoc.getElementsByTagName("from")[0].childNodes[0].nodeValue;
document.getElementById("message").innerHTML=
xmlDoc.getElementsByTagName("body")[0].childNodes[0].nodeValue;
</script>

</body>
</html>And then the xml file named "note.xml":

The first reason is IE XMLHttpRequest won't
normally read the file system but ActiveXObject
will read file system.
Second IE only gives responseXML if the
file has XML headers , you get those
headers from server not file system.

shaggykyle · 10-12-2011, 10:02 PM

Works for IE but not for Chrome

DaveyErwin · 10-12-2011, 10:29 PM

Quote:

Originally Posted by shaggykyle

Works for IE but not for Chrome

This is because of a security
setting in Chrome, go to
your run box and type in ...
chrome --allow-file-access-from-files
now when chrome opens
it will read from file system.