使用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 相关文章推荐
编写Js代码要注意的几条规则
Sep 10 Javascript
jQuery.get、jQuery.getJSON、jQuery.post无法返回JSON问题的解决方法
Jul 28 Javascript
前端必备神器 Snap.svg 弹动效果
Nov 10 Javascript
javascript引用赋值(地址传值)用法实例
Jan 13 Javascript
浅析javascript函数表达式
Feb 10 Javascript
jQuery zTree树插件动态加载实例代码
May 11 jQuery
关于jQuery.ajax()的jsonp碰上post详解
Jul 02 jQuery
AngularJS 应用模块化的使用
Apr 04 Javascript
jQuery动态移除与增加onclick属性的方法详解
Jun 07 jQuery
vue-quill-editor+plupload富文本编辑器实例详解
Oct 19 Javascript
微信小程序获取用户绑定手机号方法示例
Jul 21 Javascript
快速对接payjq的个人微信支付接口过程解析
Aug 15 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编写一个简单的路由类
2011/04/13 PHP
eaglephp使用微信api接口开发微信框架
2014/01/09 PHP
浅谈PHP中的面向对象OOP中的魔术方法
2017/06/12 PHP
php实现的表单验证类完整示例
2019/08/13 PHP
一个JavaScript继承的实现
2006/10/24 Javascript
JQuery调webservice实现邮箱验证(检测是否可用)
2013/05/21 Javascript
javascript验证身份证完全方法具体实现
2013/11/18 Javascript
$.each与$().each的区别示例介绍
2014/03/20 Javascript
js实现点击图片将图片地址复制到粘贴板的方法
2015/02/16 Javascript
Jquery调用iframe父页面中的元素及方法
2016/08/23 Javascript
bootstrap table复杂操作代码
2016/11/01 Javascript
Bootstrap基本组件学习笔记之缩略图(13)
2016/12/08 Javascript
Bootstrap表单使用方法详解
2017/02/17 Javascript
ajax实现加载页面、删除、查看详细信息 bootstrap美化页面!
2017/03/14 Javascript
vue-自定义组件传值的实例讲解
2018/09/18 Javascript
vue项目中仿element-ui弹框效果的实例代码
2019/04/22 Javascript
在项目vue中使用echarts的操作步骤
2020/09/07 Javascript
python获得linux下所有挂载点(mount points)的方法
2015/04/29 Python
Python实现获取nginx服务器ip及流量统计信息功能示例
2018/05/18 Python
Django框架的中的setting.py文件说明详解
2018/10/15 Python
对pyqt5多线程正确的开启姿势详解
2019/06/14 Python
Python 循环终止语句的三种方法小结
2019/06/24 Python
春节到了 教你使用python来抢票回家
2020/01/06 Python
TensorFlow实现从txt文件读取数据
2020/02/05 Python
Python ellipsis 的用法详解
2020/11/20 Python
全球最大最受欢迎的旅游社区:Tripadvisor
2017/11/03 全球购物
State Cashmere官网:半零售价可持续蒙古羊绒
2020/02/26 全球购物
介绍一下OSI七层模型
2012/07/03 面试题
JAVA语言如何进行异常处理,关键字:throws,throw,try,catch,finally分别代表什么意义?在try块中可以抛出异常吗?
2013/07/02 面试题
职业生涯规划书基本格式
2014/01/06 职场文书
党员创先争优公开承诺书
2014/03/28 职场文书
空乘英文求职信
2014/04/13 职场文书
给下属加薪申请报告
2015/05/15 职场文书
人间正道是沧桑观后感
2015/06/15 职场文书
大学开学感言
2015/08/01 职场文书
公司仓库管理制度
2015/08/04 职场文书