使用jquery解析XML的方法


Posted in Javascript onSeptember 05, 2014

本文实例讲述了使用jquery解析XML的方法,分享给大家供大家参考之用。具体方法如下:

一、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+"    "+name+"    "+author+"    "+price+"<br>";
   });
   $('#mydiv').html(s);
  });
 });
</script>
</head>
<body>
 <div id='mydiv'></div>
</body>
</html>

运行效果图如下:

使用jquery解析XML的方法

感兴趣的读者可以点此本站下载完整代码。

Javascript 相关文章推荐
JS backgroundImage控制
May 19 Javascript
jQuery EasyUI API 中文文档 - ComboGrid 组合表格
Oct 13 Javascript
jq实现酷炫的鼠标经过图片翻滚效果
Mar 12 Javascript
基于JQuery和CSS3实现仿Apple TV海报背景视觉差特效源码分享
Sep 21 Javascript
JS基于面向对象实现的拖拽库实例
Sep 24 Javascript
浅析jQuery Mobile的初始化事件
Dec 03 Javascript
简单理解JavaScript中的封装与继承特性
Mar 19 Javascript
vue.js入门教程之基础语法小结
Sep 01 Javascript
ES6通过babel转码使用webpack使用import关键字
Dec 13 Javascript
angularjs实现柱状图动态加载的示例
Dec 11 Javascript
微信小程序实现音乐播放器
Nov 20 Javascript
webpack proxy 使用(代理的使用)
Jan 10 Javascript
JavaScript避免内存泄露及内存管理技巧
Sep 05 #Javascript
javascript获取dom的下一个节点方法
Sep 05 #Javascript
原生JavaScript生成GUID的实现示例
Sep 05 #Javascript
javascript动态控制服务器控件实例
Sep 05 #Javascript
setTimeout()递归调用不加引号出错的解决方法
Sep 05 #Javascript
jQuery动态创建html元素的常用方法汇总
Sep 05 #Javascript
jquery单行文字向上滚动效果的实现代码
Sep 05 #Javascript
You might like
phpwind中的数据库操作类
2007/01/02 PHP
JS 网站性能优化笔记
2011/05/24 PHP
php使用mkdir创建多级目录入门例子
2014/05/10 PHP
php中实现用数组妩媚地生成要执行的sql语句
2015/07/10 PHP
深入浅析PHP无限极分类的案例教程
2016/05/09 PHP
thinkPHP5.0框架引入Traits功能实例分析
2017/03/18 PHP
【消息提示组件】,兼容IE6/7&amp;&amp;FF2
2007/09/04 Javascript
JS提交并解析后台返回的XML的代码
2008/11/03 Javascript
JAVASCRIPT keycode总结
2009/02/04 Javascript
浅谈tudou土豆网首页图片延迟加载的效果
2010/06/23 Javascript
js检测网络是否具体连接功能的代码
2014/05/23 Javascript
node.js中的querystring.escape方法使用说明
2014/12/10 Javascript
详解JavaScript中getFullYear()方法的使用
2015/06/10 Javascript
浅析JavaScript访问对象属性和方法及区别
2015/11/16 Javascript
jQuery改变form表单的action,并进行提交的实现代码
2016/05/25 Javascript
详解nodejs 文本操作模块-fs模块(三)
2016/12/22 NodeJs
详解RequireJS按需加载样式文件
2017/04/12 Javascript
JavaScript禁止微信浏览器下拉回弹效果
2017/05/16 Javascript
微信小程序自定义头部导航栏(组件化)
2019/11/15 Javascript
一个计算身份证号码校验位的Python小程序
2014/08/15 Python
python连接oracle数据库实例
2014/10/17 Python
启动targetcli时遇到错误解决办法
2017/10/26 Python
python logging重复记录日志问题的解决方法
2018/07/12 Python
python requests 库请求带有文件参数的接口实例
2019/01/03 Python
PIL对上传到Django的图片进行处理并保存的实例
2019/08/07 Python
用python3读取python2的pickle数据方式
2019/12/25 Python
python中sklearn的pipeline模块实例详解
2020/05/21 Python
Pycharm安装第三方库失败解决方案
2020/11/17 Python
用python批量移动文件
2021/01/14 Python
介绍一下JNDI的基本概念
2013/07/26 面试题
怎样写好自我鉴定
2013/12/04 职场文书
生产内勤岗位职责
2013/12/07 职场文书
投资合作协议书
2014/04/17 职场文书
法人授权委托书
2014/09/16 职场文书
python超详细实现完整学生成绩管理系统
2022/03/17 Python
Window server 2012 R2 AD域的组策略相关设置
2022/04/28 Servers