使用jquery解析XML示例代码


Posted in Javascript onSeptember 05, 2014

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>

效果图:

Javascript 相关文章推荐
模仿jQuery each函数的链式调用
Jul 22 Javascript
jQuery的.live()和.die() 使用介绍
Sep 10 Javascript
JS重要知识点小结
Nov 06 Javascript
将查询条件的input、select清空
Jan 14 Javascript
输入框过滤非数字的js代码
Sep 18 Javascript
基于jQuery实现的文字按钮表单特效整理
Dec 07 Javascript
深入解析Backbone.js框架的依赖库Underscore.js的作用
May 07 Javascript
angularJS 指令封装回到顶部示例详解
Jan 22 Javascript
JS使用tofixed与round处理数据四舍五入的区别
Oct 25 Javascript
Javascript中的作用域及块级作用域
Dec 08 Javascript
微信小程序报错: thirdScriptError的错误问题
Jun 19 Javascript
小程序实现文字循环滚动动画
Jun 14 Javascript
js实现按一下删除键删除整个单词附demo
Sep 05 #Javascript
JS获取当前网页大小以及屏幕分辨率等
Sep 05 #Javascript
JS来动态的修改url实现对url的增删查改
Sep 05 #Javascript
jQuery表格插件datatables用法总结
Sep 05 #Javascript
jQuery中index()的用法分析
Sep 05 #Javascript
使用jquery解析XML的方法
Sep 05 #Javascript
JavaScript避免内存泄露及内存管理技巧
Sep 05 #Javascript
You might like
发挥语言的威力--融合PHP与ASP
2006/10/09 PHP
php实现的太平洋时间和北京时间互转的自定义函数分享
2014/08/19 PHP
PHP编程实现微信企业向用户付款的方法示例
2017/07/26 PHP
判断控件是否已加载完成的代码
2010/02/24 Javascript
浅谈javascript的数据类型检测
2010/07/10 Javascript
让浏览器非阻塞加载javascript的几种方法小结
2011/04/25 Javascript
模仿百度三维地图的js数据分享
2011/05/12 Javascript
一个支付页面DEMO附截图
2014/07/22 Javascript
js单独获取一个checkbox看其是否被选中
2014/09/22 Javascript
JavaScript插件化开发教程 (二)
2015/01/27 Javascript
JQuery 动态生成Table表格实例代码
2016/12/02 Javascript
vue日期组件 支持vue1.0和2.0
2017/01/09 Javascript
html5 canvas 详细使用教程
2017/01/20 Javascript
js鼠标移动时禁止选中文字
2017/02/19 Javascript
bootstrap选项卡扩展功能详解
2017/06/14 Javascript
jQuery 改变P标签文本值方法
2018/02/24 jQuery
jquery的 filter()方法使用教程
2018/03/22 jQuery
vue模块拖拽实现示例代码
2019/03/09 Javascript
layUI实现三级导航菜单效果
2019/07/26 Javascript
原生JS实现音乐播放器
2021/01/26 Javascript
Python生成密码库功能示例
2017/05/23 Python
Django中的Signal代码详解
2018/02/05 Python
python统计多维数组的行数和列数实例
2018/06/23 Python
使用pandas批量处理矢量化字符串的实例讲解
2018/07/10 Python
python: 自动安装缺失库文件的方法
2018/10/22 Python
Python控制键盘鼠标pynput的详细用法
2019/01/28 Python
python数据预处理 :数据共线性处理详解
2020/02/24 Python
基于Python的一个自动录入表格的小程序
2020/08/05 Python
html5使用canvas绘制文字特效
2014/12/15 HTML / CSS
用缩写的指针比较"if(p)" 检查空指针是否可靠?如果空指针的内部表达不是0会怎么样?
2014/01/05 面试题
舞蹈教师自荐信
2014/01/27 职场文书
电子信息工程专业求职信
2014/06/28 职场文书
企业趣味活动方案
2014/08/21 职场文书
周年庆典答谢词
2015/01/20 职场文书
市语委办2016年第十九届“推普周”活动总结
2016/04/05 职场文书
Vue Element UI自定义描述列表组件
2021/05/18 Vue.js