4.在浏览器中解析XML

要在浏览器中解析获取XML数据，一般只需经过两个步骤：第一，将XML文档、XML字符串转化成XMLDoc对象。第二，使用JS操作XMLDoc对象。

3.1 将XML文档或XML字符串转化成XMLDoc对象

将XML文档转换成XML对象：

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","books.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML; 

将XML字符串转化成XMLDoc对象：

txt="<bookstore><book>";
txt=txt+"<title>Everyday Italian</title>";
txt=txt+"<author>Giada De Laurentiis</author>";
txt=txt+"<year>2005</year>";
txt=txt+"</book></bookstore>";

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);
}

3.2 使用JS操作XMLDoc对象（XML DOM操作）

有一个描述CD目录的XML文档，存放在服务器的名称为：cd_catalog.xml，其内容如下：

<?xml version="1.0" encoding="ISO-8859-1"?>
<CATALOG>
  <CD>
    <TITLE>Empire Burlesque</TITLE>
    <ARTIST>Bob Dylan</ARTIST>
    <COUNTRY>USA</COUNTRY>
    <COMPANY>Columbia</COMPANY>
    <PRICE>10.90</PRICE>
    <YEAR>1985</YEAR>
  </CD>
</CATALOG>

之后我们需要在HTML中加载XML文档：

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","cd_catalog.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;

之后通过HTML DOM/XML DOM显示XML中的数据：

x=xmlDoc.getElementsByTagName("CD");
i=0;
function displayCD()
{
    artist=(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
　　 title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
　　 year=(x[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
　　 txt="Artist: " + artist + "<br />Title: " + title + "<br />Year: "+ year;
　　 document.getElementById("showCD").innerHTML=txt;
} 

• xmlDoc -由解析器创建的 XML 文档
• getElementsByTagName("ARTIST")[0] - 第一个 <ARTIST> 元素
• childNodes[0] - <ARTIST> 元素的第一个子元素（文本节点）
• nodeValue - 节点的值（文本本身）

下面列出常用的XML DOM操作：

1、获取元素的值

value=xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;

2、获取属性的值

txt=xmlDoc.getElementsByTagName("title")[0].getAttribute("lang");

3、改变元素的值

x=xmlDoc.getElementsByTagName("title")[0].childNodes[0];
x.nodeValue="Easy Cooking";

4、改变属性的值

x=xmlDoc.getElementsByTagName("book");
for(i=0;i<x.length;i++)
{
　　x[i].setAttribute("edition","first");
}

注意：所有获取元素、属性（getElementByTagName()）的方法获取到的都是一个数组。

5、创建元素

createElement() 方法创建新的元素节点。

createTextNode() 方法创建新的文本节点。

appendChild() 方法向节点添加子节点（在最后一个子节点之后）。

如需创建带有文本内容的新元素，需要同时创建元素节点和文本节点。

下面的代码创建了一个元素 (<edition>)，然后把它添加到第一个 <book> 元素中：

newel=xmlDoc.createElement("edition");
newtext=xmlDoc.createTextNode("First");
newel.appendChild(newtext);

x=xmlDoc.getElementsByTagName("book");
x[0].appendChild(newel);

6、删除元素

removeChild() 方法删除指定的节点（或元素）。

下面的代码片段将删除第一个 <book> 元素中的第一个节点：

x=xmlDoc.getElementsByTagName("book")[0];
x.removeChild(x.childNodes[0]);