JS parses XML files and XML strings

JS parses XML files

<script type='text/javascript'>
loadXML = function(xmlFile){
var xmlDoc=null;
// Determine the type of browser 
// support IE The browser 
if(!window.DOMParser && window.ActiveXObject){
var xmlDomVersions = ['MSXML.2.DOMDocument.6.0','MSXML.2.DOMDocument.3.0','Microsoft.XMLDOM'];
for(var i=0;i<xmlDomVersions.length;i++){
try{
xmlDoc = new ActiveXObject(xmlDomVersions[i]);
break;
}catch(e){
}
}
}
// support Mozilla The browser 
else if(document.implementation && document.implementation.createDocument){
try{
/* document.implementation.createDocument('','',null);  methods 3 Parameter description 
*  The first 1 Two parameters are the namespace used to contain the document URI String; 
*  The first 2 Is a string containing the name of the document root element. 
*  The first 3 Two parameters are the type of document to be created (also known as doctype ) 
*/
xmlDoc = document.implementation.createDocument('','',null);
}catch(e){
}
}
else{
return null;
}
if(xmlDoc!=null){
xmlDoc.async = false;
xmlDoc.load(xmlFile);
}
return xmlDoc;
}
</script>

JS parses XML strings

<script type='text/javascript'>
loadXML = function(xmlString){
var xmlDoc=null;
// Determine the type of browser 
// support IE The browser 
if(!window.DOMParser && window.ActiveXObject){ //window.DOMParser  Judge right from wrong ie The browser 
var xmlDomVersions = ['MSXML.2.DOMDocument.6.0','MSXML.2.DOMDocument.3.0','Microsoft.XMLDOM'];
for(var i=0;i<xmlDomVersions.length;i++){
try{
xmlDoc = new ActiveXObject(xmlDomVersions[i]);
xmlDoc.async = false;
xmlDoc.loadXML(xmlString); //loadXML Methods loaded xml string 
break;
}catch(e){
}
}
}
// support Mozilla The browser 
else if(window.DOMParser && document.implementation && document.implementation.createDocument){
try{
/* DOMParser  Object to parse  XML  Text and return 1 a  XML Document  Object. 
*  In order to use  DOMParser , instantiate it with a no-argument constructor, and then call it  parseFromString()  methods 
* parseFromString(text, contentType)  parameter text: To parse the  XML  tag   parameter contentType The content type of the text 
*  May be  "text/xml"  , "application/xml"  or  "application/xhtml+xml"  In the 1 A. Note, not supported  "text/html" . 
*/
domParser = new DOMParser();
xmlDoc = domParser.parseFromString(xmlString, 'text/xml');
}catch(e){
}
}
else{
return null;
}
return xmlDoc;
}
</script>

Test XML

<?xml version="1.0" encoding="utf-8" ?>
<DongFang>
<Company>
<cNname>1</cNname>
<cIP>1</cIP>
</Company>
<Company>
<cNname>2</cNname>
<cIP>2</cIP>
</Company>
<Company>
<cNname>3</cNname>
<cIP>3</cIP>
</Company>
<Company>
<cNname>4</cNname>
<cIP>4</cIP>
</Company>
<Company>
<cNname>5</cNname>
<cIP>5</cIP>
</Company>
<Company>
<cNname>6</cNname>
<cIP>6</cIP>
</Company>
</DongFang>

Method of use

var xmldoc=loadXML(text.xml)
var elements = xmlDoc.getElementsByTagName("Company");
for (var i = 0; i < elements.length; i++) {
var name = elements[i].getElementsByTagName("cNname")[0].firstChild.nodeValue;
var ip = elements[i].getElementsByTagName("cIP")[0].firstChild.nodeValue;
}

While the above method is suitable for IE, let's explore the issues of IE and XML parsing in firefox

ie and firefox respectively parsed the xml document and xml string, and all the code was commented out. What functions do you want to see?
Just uncomment it.

As for parsing xml in ajax environment, the principle is the same, only in ajax, still need to parse the returned xml.

<script> 
// parsing xml The document ///////////////////////////////////////////////////// 
var xmlDoc=null; 

// support IE The browser  
if(window.ActiveXObject){ 
  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");  
} 
// support Mozilla The browser  
else if(document.implementation && document.implementation.createDocument){ 
  xmlDoc = document.implementation.createDocument('','',null); 
} 
else{ 
 alert("here"); 
} 
if(xmlDoc!=null){ 
  xmlDoc.async = false; 
  xmlDoc.load("house.xml"); 
} 

//ie And firefox is not just a parser 1 Like, the parsing process is not 1 The sample. The following ; 
//ie parsing xml The document  
//alert(xmlDoc.getElementsByTagName("address")[0].childNodes[0].childNodes[0].childNodes[0].nodeValue);// The pop-up 150 wan  
//alert(xmlDoc.getElementsByTagName("address")[0].childNodes[0].childNodes[1].childNodes[0].nodeValue);// The pop-up 1 room 3 In the  

// Layer upon layer traversal parsing childNodes[1] 
//alert(xmlDoc.childNodes[1].childNodes[1].childNodes[0].childNodes[0].nodeValue);// The pop-up 200 wan  
//alert(xmlDoc.childNodes[1].childNodes[0].childNodes[0].childNodes[0].nodeValue);// The pop-up 150 wan  
//alert(xmlDoc.childNodes[1].childNodes[0].childNodes[1].childNodes[0].nodeValue);// The pop-up 1 room 3 In the  

// You can also use item(i) To traverse the  
//var nodes=xmlDoc.documentElement.childNodes; 
//alert(nodes.item(0).childNodes.item(0).childNodes.item(0).text); // The pop-up 150 wan  
//alert(nodes.item(0).childNodes.item(1).childNodes.item(0).text); // The pop-up 1 room 3 In the  

// Firefox parsing xml The document  
// Firefox and ie parsing xml Don't 1 The value of the sample node is used textContent .  
// And he'll be on some level child You add the nodes before and after "\n" A newline character. I don't know why firebug This is what debugging looks like, so the code you write is best tested 1 Let's change the environment.)  
// In other words, regulation 1 A node is "\n", The first 2 The number of nodes is the real number 1 A node.  
// The first 3 A node is "\n", The first 4 The number of nodes is the real number 2 A node.  
// Layer upon layer acquisition parsing childNodes[0] 
//alert(xmlDoc.childNodes[0].childNodes[1].childNodes[1].textContent);// The pop-up 150 wan  
//alert(xmlDoc.childNodes[0].childNodes[1].childNodes[3].textContent);// The pop-up 1 room 3 In the  

// Get node name resolution directly getElementsByTagName("address") 
//alert(xmlDoc.getElementsByTagName("address")[0].textContent);// The pop-up 150 wan  1 room 3 In the  200 wan  300 wan  
//alert(xmlDoc.getElementsByTagName("address")[0].childNodes[1].textContent);// The pop-up 150 wan  1 room 3 In the  
//alert(xmlDoc.getElementsByTagName("address")[0].childNodes[1].childNodes[1].textContent);// The pop-up 150 wan  
//alert(xmlDoc.getElementsByTagName("address")[0].childNodes[1].childNodes[3].textContent);// The pop-up 1 room 3 In the  
//alert(xmlDoc.getElementsByTagName("address")[0].childNodes[3].textContent);// The pop-up 200 wan   

// Firefox is also available item(1) Function traversal, notice that there are also hierarchical nodes before and after nodes "\n" .  
// The first 1 A node is item(1) In the first 2 A node is item(3) In the first 3 A node is item(5) 
//item(1) The function traverses the parse  
//var nodes=xmlDoc.documentElement.childNodes; 
//alert(nodes.item(1).textContent); // The pop-up 150 wan  1 room 3 In the  
//alert(nodes.item(1).childNodes.item(1).textContent); // The pop-up 150 wan   
//alert(nodes.item(1).childNodes.item(3).textContent); //1 room 3 In the   

// parsing xml string ///////////////////////////////////////////////////////////////////////// 
var str="<car>"+ 
"<brand><price>50 wan </price><pattern>A6</pattern></brand>"+ 
"<brand><price>65 wan </price><pattern>A8</pattern></brand>"+ 
"<brand><price>17 wan </price></brand>"+ 
"</car>"; 
 
// Cross-browser, ie And firefox analytics xml The parser used is no 1 Kind of.  
var xmlStrDoc=null; 
if (window.DOMParser){// Mozilla Explorer 
 parser=new DOMParser(); 
 xmlStrDoc=parser.parseFromString(str,"text/xml"); 
}else{// Internet Explorer 
 xmlStrDoc=new ActiveXObject("Microsoft.XMLDOM"); 
 xmlStrDoc.async="false"; 
 xmlStrDoc.loadXML(str); 
} 

//ie parsing xml string  
//alert(xmlStrDoc.getElementsByTagName("car")[0].childNodes[0].childNodes[0].childNodes[0].nodeValue);// The pop-up 50 wan  
//alert(xmlStrDoc.getElementsByTagName("car")[0].childNodes[0].childNodes[1].childNodes[0].nodeValue);// The pop-up A6 
 
// You can also use item(i) To traverse the  
//var strNodes=xmlStrDoc.documentElement.childNodes; 
//alert(strNodes.item(0).childNodes.item(0).childNodes.item(0).text); // The pop-up 50 wan  
//alert(strNodes.item(0).childNodes.item(1).childNodes.item(0).text); // The pop-up A6 
 
// Firefox parsing xml string  
// Firefox and ie parsing xml Don't 1 The value of the sample node is used textContent .  
// And he'll be on some level child You add the nodes before and after "\n" A newline character.  
// In other words, regulation 1 A node is "\n", The first 2 The number of nodes is the real number 1 A node.  
// The first 3 A node is "\n", The first 4 The number of nodes is the real number 2 A node.  
//alert(xmlStrDoc.childNodes[0].childNodes[1].textContent);// The pop-up 65 wan  A8 
//alert(xmlStrDoc.childNodes[0].childNodes[1].childNodes[1].textContent);//A8 
//alert(xmlStrDoc.childNodes[0].childNodes[1].childNodes[0].textContent);// The pop-up 65 wan  
 
// Firefox is also available item(1) Function traversal, notice that there are also hierarchical nodes before and after nodes "\n" .  
// The first 1 A node is item(1) In the first 2 A node is item(3) In the first 3 A node is item(5) 
//var nodes=xmlStrDoc.documentElement.childNodes; 
//alert(nodes.item(1).textContent); // The pop-up 65 wan  A8 
//alert(nodes.item(1).childNodes.item(0).textContent); // The pop-up 65 wan   
//alert(nodes.item(1).childNodes.item(1).textContent); // The pop-up A8  
 
</script> 

Among them, the level of each node in xml is the most annoying problem, which can only be tried once. As long as a correct one comes out,
It is easy to determine the hierarchy of nodes, or debug1.
I feel that json is still better to read and understand. This parsing is too laborious!

The document house.xml reads as follows:

<?xml version="1.0" encoding="utf-8" ?>  
<address> 
  <city name=" Beijing "> 
    <price>150 wan </price> 
    <type>1 room 3 In the </type> 
  </city> 
  <city name=" Shanghai "> 
    <price>200 wan  </price> 
  </city> 
  <city name=" hangzhou "> 
    <price>230 wan </price> 
  </city> 
  <city name=" nanjing "></city> 
</address> 

That's all for this article, I hope you enjoy it.