AJAX指南----操作XML

来源：互联网发布：淘宝评价发图片编辑：程序博客网时间：2024/05/21 14:08

转贴地址：
http://www.xrss.cn/Info/4628.Html

今天操作 XMl 文件时除了很多问题，解决了半天。最后总结两条原因。
对于后台传递过来的 Xml 字符串而言，如果你输出 xmlHttpRequest. responseText 出来，你会发现，这格方法会过滤掉所有的 XML 标签。

如果你调用 :
var xmldoc = req.responseXML; //req 是XMLHttpRequest 对象
var Node = xmldoc .getElementsByTagName(” 你要查找的标签“)
如果 Node.length 永远得到一个 0 的话，那么最大的可能就是后台 XML 文件的格式出现问题标签不匹配。。

到此结束

通过上一章的学习,我们已经对AJAX的工作原理有了一个基本的了解,但是上一章的例子中并没有用到AJAX中很重要的一个组件Xml，所以上一章的例子最多只能称为AJAH（HTML）或者干脆就是AJAT（TEXT），因此这一章我们就来学习如何使用AJAX操作Xml。

同上一章一样，首先我们需要创建一个XmlHttp对象：

var http = getHTTPObject();

假设我们有一个Xml文件mailbox.Xml，它的内容如下：

<?Xml version="1.0" encoding="GB2312"?>
<mailbox>
<mail>
<to>老李</to>
<from>老张</from>
<heading>好久不见！</heading>
<body>好久不见，最近好吗?</body>
</mail>
<mail>
<to>小李</to>
<from>小王</from>
<heading>周末有空么？</heading>
<body>周末有空么？一起看场电影吧！</body>
</mail>
</mailbox>

可以看到，里面存储了两封邮件，现在我们的目标就是把这两封邮件以HTML的方式展现出来，首先我们需要创建一个简单的HTML的界面：

<p><button onclick="loadXmlDoc('bookshelf.Xml', parseBookShelf)">查看书架</button></p>
<div id="AJAX-sample"></div>

AJAX-sample块用于展示邮件，但查看信箱按钮被按下时，loadXmlDoc函数将被调用：

function loadXmlDoc(name, parseFunc)
{
http.open("GET", name, true);
http.onreadystatechange = parseFunc;
http.send(null);
}

可以看到，这个函数只是简单的向服务器发送一个GET请求，真正对Xml文档进行处理的是parseFunc，也就是我们传入的parseMailBox函数：

function parseMailBox()
{
//4表示请求已完成
if (http.readyState == 4) {
//responseXml是一个HTML DOM Document对象，
//我们将使用它来解析Xml文档
var mailBoxXml = http.responseXml;
//获取所有信件
var mails = mailBoxXml.getElementsByTagName('mail');
var mailStr = "";

for (var i = 0; i < mails.length; i++) {
var mail = mails;

//解析信件
var to = getElementText(mail, "to");
var from = getElementText(mail, "from");
var heading = getElementText(mail, "heading");
var body = getElementText(mail, "body");

//为信件添加附属信息
mailStr += "收信人：" + to + "<br>";
mailStr += "发信人：" + from + "<br>";
mailStr += "标题：" + heading + "<br>";
mailStr += "正文：<br>" + body + "<br><br>";
}
//将信件展示到页面上
document.getElementById("AJAX-sample").innerHTML = mailStr;
}
}

getElemenText函数相当简单，它的作用就是获取一个元素的文本：

function getElementText(parentElem, name)
{
var result = parentElem.getElementsByTagName(name)[0];
return result.firstChild.nodevalue;
}

这样一个Xml文档就解析完毕了，是不是相当的简单。