XML 文件内容：
<?xml version="1.0" encoding="UTF-8"?>

<stulist>

        <student  email="1@1.com">

                <name>zhangsan</name>

                <id>1</id>

        </student>

        <student  email="2@2.com">

               <name>lisi</name>

                <id>2</id>

        </student>

</stulist>

html 文件内容：

<!DOCTYPE html>

<html>

<head>

    <title> jQuery 解析 XML </title>

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

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

    <script type="text/javascript">

        $(function() {

            $("button").click(function(){

                $.ajax({

                    url:'ajax.xml',

                    type: 'GET',

                    dataType: 'xml',

                    timeout: 1000,

                    cache:false,

                    error: function(xml){

                        alert('加载XML文档出错');

                    },

                    success: function(xml){

                        //建立一个代码片段

                        var frag=$("<ul/>");

                        //遍历所有student节点

                        $(xml).find("student").each(function(i){

                            //获取id节点

                            var id=$(this).children("id"),

                            //获取节点文本

                                id_value=id.text(),

                            //获取student下的email属性。

                                email=$(this).attr("email");

                            //构造HTML字符串，通过append方法添加进之前建立代码片段

                            frag.append("<li>"+id_value+"-"+email+"</li>");

                        });

                        //最后得到的frag添加进HTML文档中

                        frag.appendTo("#load");

                    }

                });

            });

        });

    </script>

</head>

<body>

<button>加载</button>

<div id="load"></div>

</body>

</html>
 
        $.ajax({

            url: "xml/menu.xml",

            dataType: 'xml',

            type: 'GET',

            timeout: 2000,

            cache: false,

            error: function(xml) {

                alert("加载菜单时出错！");

            },

            success: function(xml) {

                //建立一个代码片段

                var frag = $("<ul/>");

                //遍历所有student节点

                $(xml).find("Root>Node:parent").each(function(i) {

                    //获取student下的email属性。

                    var text = $(this).attr("Text"),

                        href = $(this).attr("NavigateUrl"),

                        key  = $(this).attr("KeyIndex");

                    //构造HTML字符串，通过append方法添加进之前建立代码片段

                    frag.append("<li>" + text +"_"+href+ "_"+key+ "</li>");

                });

                //最后得到的frag添加进HTML文档中

                frag.appendTo("#load");

            }

        });

[转]jQuery 读取 xml的更多相关文章

  1. jquery 读取xml

    <script type="text/javascript" src="jquery/jquery-1.11.3.min.js"></scri ...

  2. JQuery读取XML文件

    <?xml version="1.0" encoding="utf-8" ?> <taxrates> <taxrate id=&q ...

  3. jquery读取XML 生成页面文件

    $.get("../../js/data.xml", function (xml) { $(xml).find("local").each(function ( ...

  4. javascript读取xml的方法【转载】

    jquery读取xml文件 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http ...

  5. Js读取XML文件为List结构

    习惯了C#的List集合,对于Javascript没有list 极为不舒服,在一个利用Js读取XML文件的Demo中,决定自己构建List对象,将数据存入List. 第一步,Js读取XML文件知识 X ...

  6. jQuery、JS读取xml文件里的内容（JS先通过document.implementation.createDocument方法将xml转换成document对象，jQuery将读取到的xml转成table）

    xml文件:test.xml <?xml version="1.0"?> <note> <to>George</to> <fr ...

  7. 160928、JQuery解析XML数据的demo

    用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 方案1 当后台返回的数据类型是xml对象 ...

  8. PHP读取xml方法讲解

    一,什么是xml,xml有什么用途 XML(Extensible Markup Language)即可扩展标记语言,它与HTML一样,都是SGML(Standard Generalized Marku ...

  9. jquery解析XML(1)

    jquery解析XML文件 html代码 <!DOCTYPE html><html><head><title>解析XML</title>&l ...

随机推荐

  1. luogu P1017 进制转换

    感觉这个题 是真的恶心 本来单纯就递归写,发现好难 后来用数组记录 然后考虑 指数为 奇和偶数 分别 <0 和 > 进制的情况 其实 用进制数为3 大概讨论四种情况就可以了 由于最近就是在 ...

  2. LeetCode——Next Permutation

    1. Question Implement next permutation, which rearranges numbers into the lexicographically next gre ...

  3. POJ 1730 Perfect Pth Powers（唯一分解定理）

    http://poj.org/problem?id=1730 题意:给出一个n,a=b^p,求出最大p值. 思路: 首先利用唯一分解定理,把n写成若干个素数相乘的形势.接下来对于每个指数求最大公约数, ...

  4. 前端工程化 - bower

    什么是bower bower是前端的包管理工具,类似于php的composer,python的pip,虽然先如今bower已经停止了更新(主要是因为Browserify和Webpack等包管理工具的兴 ...

  5. mybatis 环境搭建和基本说明

    mybatis介绍就不多提了,直接步入正题. 先准备好eclipse和MySQL,然后先看一下目录结构 文件和类很少,所以mybatis的搭建是非常简单的,如搭建中遇到问题可以先参考文档最后一部分的综 ...

  6. Jbuilder(3300✨)

    https://github.com/rails/jbuilder Jbuilder(3300✨) Jbuilder gives you a simple DSL for declaring JSON ...

  7. UVALive-3972 March of the Penguins （最大流：节点容量）

    题目大意:有n个带有裂缝的冰块.已知每个冰块的坐标和已经站在上面的企鹅数目,每当一个企鹅从一个冰块a跳到另一个冰块b上的时候,冰块a上的裂缝便增大一点,还知道每个冰块上最多能被跳跃的次数.所有的企鹅都 ...

  8. HttpResponse 类

    而封闭HTTP输出信息的类型就是HttpResponse类,使用HttpResponse类可以实现三种类型的输出,即文本,URL,二进制流.  实现这三类的属性和方法分别介绍如下:1.文本的输出,在日 ...

  9. CSS3全新的背景图片方案

    CSS3全新的背景图片方案 firefox支持指定一个元素的ID将它作为另一个元素的背景-moz-element(#ID), webkit系支持-webkit-canvas(xxxx)动态创建一个ca ...

  10. Javascript几种创建对象的方法

    1.工厂方法 demo.js 1 2 3 4 5 6 7 8 9 10 11 function createPerson(name, age) { var person = new Object(); ...