使用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 相关文章推荐
Javascript - HTML的request类
Jan 09 Javascript
Javascript学习笔记二 之 变量
Dec 15 Javascript
ASP.NET jQuery 实例18 通过使用jQuery validation插件校验DropDownList
Feb 03 Javascript
javascript计算用户打开网页的停留时间
Jan 09 Javascript
JavaScript实现大数的运算
Nov 24 Javascript
下雪了 javascript实现雪花飞舞
Aug 02 Javascript
jQuery中的ready函数与window.onload谁先执行
Jun 21 Javascript
纯JS打造网页中checkbox和radio的美化效果
Oct 13 Javascript
vue 1.x 交互实现仿百度下拉列表示例
Oct 21 Javascript
Node.js 使用AngularJS的方法示例
May 11 Javascript
JQuery通过后台获取数据遍历到前台的方法
Aug 13 jQuery
vue单页应用在页面刷新时保留状态数据的方法
Sep 21 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与javascript的两种交互方式
2006/10/09 PHP
php后台如何避免用户直接进入方法实例
2013/10/15 PHP
jquery+php+ajax显示上传进度的多图片上传并生成缩略图代码
2014/10/15 PHP
Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 2611816 bytes)
2014/11/08 PHP
php中switch与ifelse的效率区别及适用情况分析
2015/02/12 PHP
分享几个超级震憾的图片特效
2012/01/08 Javascript
js操作iframe的一些方法介绍
2013/06/25 Javascript
js 控制图片大小核心讲解
2013/10/09 Javascript
JavaScript实现自动变换表格边框颜色
2015/05/08 Javascript
JS实现部分HTML固定页面顶部随屏滚动效果
2015/12/24 Javascript
jQuery无刷新上传之uploadify3.1简单使用
2016/06/18 Javascript
jQuery列表检索功能实现代码
2017/07/17 jQuery
vue-music关于Player播放器组件详解
2017/11/28 Javascript
微信小程序实现验证码获取倒计时效果
2018/02/08 Javascript
JS实现可针对算术表达式求值的计算器功能示例
2018/09/04 Javascript
vue全局自定义指令-元素拖拽的实现代码
2019/04/14 Javascript
利用JS代码自动删除稿件的普通弹幕功能
2019/09/20 Javascript
Vue两个版本的区别和使用方法(更深层次了解)
2020/02/16 Javascript
JS浏览器BOM常见操作实例详解
2020/04/27 Javascript
动态创建类实例代码
2009/10/07 Python
PHP魔术方法__ISSET、__UNSET使用实例
2014/11/25 Python
用Python编写简单的定时器的方法
2015/05/02 Python
pandas数据处理基础之筛选指定行或者指定列的数据
2018/05/03 Python
django 删除数据库表后重新同步的方法
2018/05/27 Python
python 实现将文件或文件夹用相对路径打包为 tar.gz 文件的方法
2019/06/10 Python
python中eval与int的区别浅析
2019/08/11 Python
使用 PyTorch 实现 MLP 并在 MNIST 数据集上验证方式
2020/01/08 Python
Python中Selenium模块的使用详解
2020/10/09 Python
CSS3混合模式mix-blend-mode/background-blend-mode简介
2018/03/15 HTML / CSS
详解利用canvas实现环形进度条的方法
2019/06/12 HTML / CSS
Lands’ End官网:经典的美国生活方式品牌
2016/08/14 全球购物
沙特阿拉伯排名第一的在线时尚购物应用程序:1Zillion
2020/08/08 全球购物
什么造成了Java里面的异常
2016/04/24 面试题
法学专业本科生自荐信范文
2013/12/17 职场文书
教师专业自荐书范文
2014/02/10 职场文书
创先争优活动承诺书
2014/08/30 职场文书