AJAX指南--- 操作XML入门

学好外语能够获得更多的国外先进编程技术 [enadd 2006年12月25日]

	您现在的位置：编程笔记网 >> Web开发 >> 网络编程 >> AJAX >> 文章正文

AJAX指南--- 操作XML入门

热荐

【字体：小大】

AJAX指南--- 操作XML入门

作者：- 文章来源：- 点击数：更新时间：2006-7-18

首先我们需要创建一个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('mailbox.xml’, parseMailBox)">查看邮件</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文档就解析完毕了，是不是相当的简单。

[1] [2] [3] [4] 下一页

文章录入：enadd 责任编辑：enadd

上一篇文章： AJAX在Post中文的时候解决乱码的方法

下一篇文章：利用AJAX与数据岛实现无刷新绑定

【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】

最新热点		最新推荐		相关文章
				一个最简单的AJAX实例及解析利用AJAX与数据岛实现无刷新… AJAX在Post中文的时候解决乱… Ajax基石脚本异步并发调用参… 使用Ajax的挑战二级联动下拉框了解Ajax框架 XMLHttpRequest和Ajax入主We… 关于ajax的一些随笔褪色一例

　网友评论：（只显示最新10条。评论内容只代表网友观点，与本站立场无关！）

\| 设为首页 \| 加入收藏 \| 联系站长 \| 友情链接 \| 版权申明 \| 管理登录 \|


	Copyright ©2000 - 2005 Enadd.com 备案序号:辽ICP备06005595号 QQ:1656107 站长：enadd