使用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 相关文章推荐
ppk谈JavaScript style属性
Oct 10 Javascript
Document 对象的常用方法
Jul 31 Javascript
jQuery点击自身以外地方关闭弹出层的简单实例
Dec 24 Javascript
Ext4.2的Ext.grid.plugin.RowExpander无法触发事件解决办法
Aug 15 Javascript
Javscript调用iframe框架页面中函数的方法
Nov 01 Javascript
基于jQuery实现的图片切换焦点图整理
Dec 07 Javascript
详解springmvc 接收json对象的两种方式
Dec 06 Javascript
WEB开发之注册页面验证码倒计时代码的实现
Dec 15 Javascript
ES6新特性之函数的扩展实例详解
Apr 01 Javascript
jQuery实现table表格信息的展开和缩小功能示例
Jul 21 jQuery
vuex+axios+element-ui实现页面请求loading操作示例
Feb 02 Javascript
原生js实现无缝轮播图效果
Jan 28 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
一个简单的php实现的MySQL数据浏览器
2007/03/11 PHP
取得单条网站评论以数组形式进行输出
2014/07/28 PHP
php 类自动载入的方法
2015/06/03 PHP
PHP中rename()函数的妙用讲解
2019/02/28 PHP
用于判断用户注册时,密码强度的JS代码
2009/01/01 Javascript
jqPlot Option配置对象详解
2009/07/25 Javascript
jQuery 使用手册(三)
2009/09/23 Javascript
使用AOP改善javascript代码
2015/05/01 Javascript
jQuery超酷平面式时钟效果代码分享
2020/03/30 Javascript
AngularJS中run方法的巧妙运用
2017/01/04 Javascript
微信小程序 页面跳转及数据传递详解
2017/03/14 Javascript
axios基本入门用法教程
2017/03/25 Javascript
jQuery EasyUI 组件加上“清除”功能实例详解
2017/04/11 jQuery
基于JQuery的Ajax方法使用详解
2017/08/16 jQuery
js匿名函数使用&amp;传参(实例)
2017/09/08 Javascript
JS实现简易换图时钟功能分析
2018/01/04 Javascript
vue-router懒加载速度缓慢问题及解决方法
2018/11/25 Javascript
深入理解js A*寻路算法原理与具体实现过程
2018/12/13 Javascript
vue.js实现双击放大预览功能
2020/06/23 Javascript
[01:31:03]DOTA2完美盛典全回顾 见证十五项大奖花落谁家
2017/11/28 DOTA
python 时间戳与格式化时间的转化实现代码
2016/03/23 Python
Python实现树的先序、中序、后序排序算法示例
2017/06/23 Python
python3.4 将16进制转成字符串的实例
2019/06/12 Python
python3连接mysql获取ansible动态inventory脚本
2020/01/19 Python
Python2 与Python3的版本区别实例分析
2020/03/30 Python
Fanatics官网:运动服装、球衣、运动装备
2020/10/12 全球购物
EJB的激活机制
2013/10/25 面试题
二手书店创业计划书
2014/01/16 职场文书
优秀体育委员自荐书
2014/01/31 职场文书
经典安踏广告词
2014/03/21 职场文书
博士毕业生自我鉴定范文
2014/04/13 职场文书
班主任与学生安全责任书
2014/07/25 职场文书
四风对照检查剖析材料
2014/10/07 职场文书
2016自主招生校长推荐信范文
2015/03/23 职场文书
初二英语教学反思
2016/02/15 职场文书
浅谈Python中对象是如何被调用的
2022/04/06 Python