`
javaEEdevelop
  • 浏览: 865340 次
  • 性别: Icon_minigender_1
  • 来自: 广州
文章分类
社区版块
存档分类
最新评论

jquery 解析xml

 
阅读更多

package cn.limaoyuan.jquery.xml;

import java.io.IOException;

import java.io.PrintWriter;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

public class JqueryServletForXml extends HttpServlet {

    public void doGet(HttpServletRequest request, HttpServletResponse response)

            throws ServletException, IOException {

        System.out.println("into JqueryServletForXml");

        //response.setContentType("text/html"); //以text/html方式返回

                                response.setContentType("text/xml");

        response.setCharacterEncoding("gbk");

        String xml = "<?xml version=\"1.0\" encoding=\"gbk\"?><userlist><user><name>limy_1</name><age>25_1</age></user><user><name>limy_2</name><age>25_2</age></user></userlist>";

        response.getWriter().println(xml);

    }

    public void doPost(HttpServletRequest request, HttpServletResponse response)

            throws ServletException, IOException {

        doGet(request, response);

    }

}

2.页面的东东

程序代码

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=gbk" />

        <title>StripingTable</title>

        <style type="text/css">

        <!--

            *.*{

                font-size: 12px;

            }

        -->

        </style>

        

        <script type="text/javascript" src="jquery-1.2.1.js"></script>

        <script type="text/javascript" src="loadxml.js"></script>

        <script type="text/javascript">

        <!--

            $(document).ready(function(){});

            

            function getAjaxByXml(){

            

                $("#info").ajaxStart(function(){

                   $(this).attr("innerHTML","开始加载!");

                 });

                

                 $("#info").ajaxError(function(request, settings){

                   $(this).attr("innerHTML","出错页面:" + settings.url);

                 });

                

                 $("#info").ajaxSuccess(function(){

                   $(this).attr("innerHTML","加载完成!");

                 });

                

                $.post("../servlet/JqueryServletForXml",{t:new Date()},function(data){

                                                                                 //1.服务器设置的text/xml格式

                                                                                var node = data.selectNodes("//user"); //这里data直接就已经是xml对象了,可以直接使用xpath进行解析

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

                        var children = node[i].childNodes; //得到user节点的子节点集合

                        var childLen = children.length;

                        for(var j=0;j<childLen;j++){

                            //alert(children[j].firstChild.nodeValue); //得到子节点第一个文本对象的值

                            $("#responseText").append(children[j].firstChild.nodeValue +"  ");

                        }

                    }

                                                                                

                                                                                //2.如果服务器设置返回的是text/html,而又想用xml对象,那么就需要单独来转换一下

                    var xmlDoc = loadXML(false,data);//这时的data只是普通的字条串,经过这步后的xmlDoc才是xml对象了

                    var node = xmlDoc.selectNodes("//user"); //得到所有user节点

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

                        var children = node[i].childNodes; //得到user节点的子节点集合

                        var childLen = children.length;

                        for(var j=0;j<childLen;j++){

                            //alert(children[j].firstChild.nodeValue); //得到子节点第一个文本对象的值

                            $("#responseText").append(children[j].firstChild.nodeValue +"  ");

                        }

                    }

                                                                               //3.纯jquery解析xml,前提返回的要是text/xml格式

                    //var name = $(data).find("user").find("name").eq(1).text();//如果单取某一个user可以用eq(index)这个方法                    

                    $(data).find("user").each(function(){

                        var name = $(this).find("name").text();

                        var age = $(this).find("age").text();

                        $("#responseText").append(name+" " + age + "   <br/>");

                    });

                                                                                //4.纯jquery解析xml,方法二!更深奥,当然方法没有第3种简便,关键是掌握取得层次关系可以用find(父级+空格+子级)来定位

                    $(data).find("user").each(function(i){

                        var name = $(data).find("user name").eq(i).text(); //用find的另一个用法(父级+空格+子级)

                        var age = $(data).find("user age").eq(i).text();

                        $("#responseText").append(name+" " + age + "   <br/>");

                    });

                });

            }

        -->

        </script>

    </head>

    <body>

        <input type="button" value="测试服务器回传xml" onclick="getAjaxByXml()"/>

        <div id="responseText"></div>

        <div id="info"></div>

    </bdoy>

</html>

3.提供一个js生成xml对象的类loadxml.js

程序代码

/**

* 封装装载XML的方法,并返回XML文档的根元素节点。

* @param flag true时参数xml表示xml文档的名称;false时参数xml是一个字符串,其内容是一个xml文档

* @param xml 根据flag参数的不同表示xml文档的名称或一个xml文档的字符串表示

*/

function loadXML(flag,xml){

var xmlDoc;

//针对IE浏览器

if(window.ActiveXObject){

var aVersions = ["MSXML2.DOMDocument.6.0","MSXML2.DOMDocument.5.0","MSXML2.DOMDocument.4.0","MSXML2.DOMDocument.3.0","MSXML2.DOMDocument","Microsoft.XmlDom"];

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

try {

//建立xml对象

xmlDoc = new ActiveXObject(aVersions[i]);

break;

} catch (oError) {

}

}

if(xmlDoc != null){

    //同步方式加载XML数据

xmlDoc.async = false;

//根据XML文档名称装载

if(flag == true){

        xmlDoc.load(xml);

} else{

        //根据表示XML文档的字符串装载

        xmlDoc.loadXML(xml);

}

//返回XML文档的根元素节点。

return xmlDoc.documentElement;

}

} else{

//针对非IE浏览器

    if(document.implementation && document.implementation.createDocument){

      /*

       第一个参数表示XML文档使用的namespace的URL地址

       第二个参数表示要被建立的XML文档的根节点名称

       第三个参数是一个DOCTYPE类型对象,表示的是要建立的XML文档中DOCTYPE部分的定义,通常我们直接使用null

       这里我们要装载一个已有的XML文档,所以首先建立一个空文档,因此使用下面的方式

      */

      xmlDoc = document.implementation.createDocument("","",null);

      if(xmlDoc != null){

       //根据XML文档名称装载

        if(flag == true){

          //同步方式加载XML数据

xmlDoc.async = false;

          xmlDoc.load(xml);

        } else{

          //根据表示XML文档的字符串装载

          var oParser = new DOMParser();

          xmlDoc = oParser.parseFromString(xml,"text/xml");

        }

        //返回XML文档的根元素节点。

        return xmlDoc.documentElement;

      }

    }

}

  return null;

}

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics