Read XML file using JavaScript in Chrome

Question

I need to load and read an XML file using JavaScript.

The following code works fine in Firefox, IE and Opera:

function loadXMLDoc(dname) {
  var xmlDoc

  // Internet Explorer
  try {
    xmlDoc = new ActiveXObject('Microsoft.XMLDOM')
  }
  catch (e) {
    // Firefox, Opera, etc.
    try {
      xmlDoc = document.implementation.createDocument('', '', null)
    }
    catch (e) {
      alert(e.message)
    }
  }

  try {
    xmlDoc.async = false
    xmlDoc.load(dname)
    return xmlDoc
  }
  catch (e) {
    alert(e.message)
  }

  return null
}

But executing this code in Chrome gives me this error:

Object# has no method "load"

Hi @putvande..thank you for response me, i can't get from you? Loadxml is just function which take from w3school website.my problem is chrome browser will not working fine.. any idea for my problem? — user2711066, Aug 26 '13 at 11:06
Why use XMLDocument object instead of DOMParser/Microsoft.XMLDOM? You can load the xml text with an xhmlhttp request. — HMR, Aug 26 '13 at 11:11
Hi @HMR..I got your point..I am newbie in xml parsing functionality.I searching XML DOM only..I had much more knowledge in Dom-parser.can you give some idea for me? It will more helpful for me — user2711066, Aug 26 '13 at 11:15
Hi @HMR..Any idea about this ? Please some responsible comment from you. — user2711066, Aug 26 '13 at 11:45

score 7 · Accepted Answer · edited Jun 04 '21 at 19:53

Legacy Code

document.implementation.createDocument does not work on Chrome and Safari.

Use XMLHttpRequest instead when possible:

function loadXMLSync(url) {
  try {
    // Prefer XMLHttpRequest when available
    var xhr = new XMLHttpRequest()
    xhr.open('GET', url, false)
    xhr.setRequestHeader('Content-Type', 'text/xml')
    xhr.send()

    return xhr.responseXML
  }
  catch (e) {
    // XMLHttpRequest not available, fallback on ActiveXObject
    try {
      var activex = new ActiveXObject('Microsoft.XMLDOM')
      activex.async = false
      activex.load(url)

      return activex
    }
    catch (e) {
      // Neither XMLHttpRequest or ActiveXObject are available
      return undefined
    }
  }
}

Modern Browsers

If you're targeting modern browsers (> IE6), just use XMLHttpRequest:

function loadXMLSync(url) {
  var xhr = new XMLHttpRequest()

  xhr.open('GET', url, false)
  xhr.setRequestHeader('Content-Type', 'text/xml')
  xhr.send()

  return xhr.responseXML
}

isn't ActiveXObject deprecates for modern browsers? – Don Cheadle Apr 15 '16 at 16:20 — Don Cheadle, Apr 15 '16 at 16:20

score 1 · Answer 2 · answered Aug 26 '13 at 13:01

1

On MDN, there is guidance to use XMLHttpRequest. But it isn't clear from DOMImplementation.createDocument until you drill into the return type and see that XMLDocument is not supported in Google Chrome. The example on W3Schools uses XMLHttpRequest.

answered Aug 26 '13 at 13:01

Thomas Tregner

41
4

score 0 · Answer 3 · answered Aug 14 '17 at 14:03

follow this to print,load,append xml data.Here xml is stored as string inside javascript.This method works in chrome,firefox hopes it will work in others too

txt="<papers>"+"<paper>"+
 "<author>athor name</author>"+
"<title>title</title>"+
"<path>path</path>"+
"<track>which tack</track>"+
 "</paper>"+
"<paper>"+
"<author>athor name</author>"+
"<title>title</title>"+
"<path>path</path>"+
"<track>which tack</track>"+
"</paper>"+
"<paper>"+
"<author>athor name</author>"+
"<title>title</title>"+
"<path>path</path>"+
"<track>which tack</track>"+
"</paper>"+
"<papers>";
if (window.DOMParser)
  {
      parser=new DOMParser();
  xmlDoc=parser.parseFromString(txt,"text/xml");

   }
   else // Internet Explorer
    {
     xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
     xmlDoc.async=false;
     xmlDoc.loadXML(txt);
    }

x=xmlDoc.getElementsByTagName("paper"); 
for (var i = 0; i < x.length; i++) {  
    var athor =x[i].childNodes[0].firstChild.nodeValue;
    var title = x[i].childNodes[1].firstChild.nodeValue;
    var path = x[i].childNodes[2].firstChild.nodeValue;
    var tack =x[i].childNodes[3].firstChild.nodeValue;
    //do something with these values...
    //each iteration gives one paper details    
    var xml=document.getElementById("element_id");//<div id="element_id"></div>
    var li = document.createElement("br");// create a new <br>  
    newlink = document.createElement('A'); // creating an <a> element
    newlink.innerHTML = athor;// adding <a>athor value here</a>
    newlink.setAttribute('href', path);// <a href="path"></a>

    newlink.appendChild(li);// <a href="path">athor</a><br>
    document.getElementById("element_id").appendChild(newlink);
//finaly it becomes <div id="element_id"><a href="path">athor</a><br></div>


}

i posted this answer here

score 0 · Answer 4 · answered Sep 14 '18 at 06:57

Add

    var xhr = new XMLHttpRequest(); 
    xhr.open("GET", "/example/xdom/books.xml", false); 
    xhr.send(null); 
    xmlDoc = xhr.responseXML.documentElement; 
    return xmlDoc;

in catch statement. Like below:

function loadXMLDoc(dname) {
  var xmlDoc

  // Internet Explorer
  try {
    xmlDoc = new ActiveXObject('Microsoft.XMLDOM')
  }
  catch (e) {
    // Firefox, Opera, etc.
    try {
      xmlDoc = document.implementation.createDocument('', '', null)
    }
    catch (e) {
      alert(e.message)
    }
  }

  try {
    xmlDoc.async = false
    xmlDoc.load(dname)
    return xmlDoc
  }
  catch (e) {
    //alert(e.message)
    // For Chrome 
    var xhr = new XMLHttpRequest(); 
    xhr.open("GET", "/example/xdom/books.xml", false); 
    xhr.send(null); 
    xmlDoc = xhr.responseXML.documentElement; 
    return xmlDoc;
  }

  return null
}

Read XML file using JavaScript in Chrome

4 Answers4

Legacy Code

Modern Browsers

Linked