xml文件结构:books.xml

<?xml version="1.0" encoding="UTF-8"?>
<root>
    <book id="1">
        <name>深入浅出extjs</name>
        <author>张三</author>
        <price>88</price>
    </book>
    <book id="2">
        <name>锋利的jQuery</name>
        <author>李四</author>
        <price>99</price>
    </book>
    <book id="3">
        <name>深入浅出flex</name>
        <author>王五</author>
        <price>108</price>
    </book>
    <book id="4">
        <name>java编程思想</name>
        <author>钱七</author>
        <price>128</price>
    </book>
</root>

页面代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jquery解析xml</title>
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
    $(function(){
        $.post('books.xml',function(data){
            //查找所有的book节点
            var s="";
            $(data).find('book').each(function(i){
                var id=$(this).attr('id');
                var name=$(this).children('name').text();
                var author=$(this).children('author').text();
                var price=$(this).children('price').text();
                s+=id+"&nbsp;&nbsp;&nbsp;&nbsp;"+name+"&nbsp;&nbsp;&nbsp;&nbsp;"+author+"&nbsp;&nbsp;&nbsp;&nbsp;"+price+"<br>";
            });
            $('#mydiv').html(s);
        });
    });
</script>
</head>
<body>
    <div id='mydiv'></div>
</body>
</html>

效果图:
 
完整示例下载

轻松使用jquery解析XML的更多相关文章

  1. 使用Jquery解析xml的两种方法

    第一种方案(最稳妥): 先将String格式的xml转换为xml对象,然后再用Jquery解析xml对象 var returnDataXml = parseXML(returnData); var p ...

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

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

  3. 使用jQuery解析xml时command节点解析失败

    jQuery版本1.8.3 待解析的xml为: <message><user><command>Login</command></message& ...

  4. jquery解析XML(1)

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

  5. JQuery解析XML数据的几个例子

    用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 第一种方案: <script ty ...

  6. JQuery 解析xml

    JQuery 可以通过 $.get() 或 $.post() 方法来加载 xml.     JQuery 解析 XML 与解析 DOM 一样, 可以使用 find(), children() 等函数来 ...

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

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

  8. JQuery -- Jquery 中的Ajax, Jquery解析xml文件

    1. JQuery 对 Ajax 操作进行了封装,在 jQuery 中最底层的方法时 $.ajax(), 第二层是 load(), $.get() 和 $.post(),第三层是$.getScript ...

  9. 几个JQuery解析XML的程序例子

    用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做.下面我们来总结几个使用JQuery解析XML的例子. 第一种方案: <script ty ...

随机推荐

  1. webdriver API study

    This chapter cover all the interfaces of Selenium WebDriver. Recommended Import Style The API defini ...

  2. 多进程对 MySQL update的影响

    今天要做数据清洗的时候,要更新一个数据库字段,考虑到用多进程去更新数据库,也许程序会跑得快一些,结果开了64个进程, 结果是其他程序更新的时候,速度非常慢,最后发现的原因是,数据库中有64个SQL语句 ...

  3. 使用 docker 搭建 openvpn，创建、删除用户证书

    我自己的配置,服务器:ubuntu16.04 + docker 17.12.0-ce:客户端:win10 + openvpn2.4.5 1 在dockerhub上搜索 openvpn,我是用的是 进去 ...

  4. HDU 2444 The Accomodation of Students二分图判定和匈牙利算法

    本题就是先推断能否够组成二分图,然后用匈牙利算法求出最大匹配. 究竟怎样学习一种新算法呢? 我也不知道什么方法是最佳的了,由于看书本和大牛们写的匈牙利算法具体分析,看了几乎相同两个小时没看懂,最后自己 ...

  5. 【Android】6.1 Toast（信息提示框）

    分类:C#.Android.VS2015: 创建日期:2016-02-08 一.简介 Toast用于向用户显示一些帮助或者提示信息.前面我们已经多次用到它,这里只是系统地将其总结一下,并演示它的各种基 ...

  6. HTTP请求中的Keep-Alive模式详解

    Keep-Alive模式 我们都知道HTTP是基于TCP的,每一个HTTP请求都需要进行三步握手.如果一个页面对某一个域名有多个请求,就会进行频繁的建立连接和断开连接.所以HTTP 1.0中出现了Co ...

  7. tornado日志使用详解

    1.需求 将http访问记录,程序自定义日志输出到文件,按天分割,保留最近30天的日志. 2.使用示例 init_logging("%s/QYK.%s.%s.log" % (log ...

  8. QT 4.8 静态库编译方法

    最最初踏上QT之路是受到了XiaomaGee的指点,相比于常规的窗口程序开发,QT有着以下特点: 1. 优良的跨平台特性(支持Win.Linux.Mac 不同的平台下只需重新编译即可使用) 2. 面向 ...

  9. Mixing ASP.NET Webforms and ASP.NET MVC

    https://www.packtpub.com/books/content/mixing-aspnet-webforms-and-aspnet-mvc *********************** ...

  10. opensips安装

    主要流程见这个教程吧:感谢大佬 http://blog.csdn.net/u011026329/article/details/50821679 其中 mediaproxy的安装会出错.做如下修改 下 ...