JQuery解析XML数据的几个简单实例


Posted in Javascript onMay 18, 2016

用JavaScript解析XML数据是常见的编程任务,JavaScript能做的,JQuery当然也能做。下面我们来总结几个使用JQuery解析XML的例子。

第一种方案:

<script type="text/javascript">
$(document).ready(function() {
	$.ajax({
	 	url: 'https://3water.com/cgi/test.xml',
	 	dataType: 'xml',
	 	success: function(data){
		 	//console.log(data);
		 	$(data).find("channel").find("item").each(function(index, ele) {
				var titles = $(ele).find("title").text();
				var links = $(ele).find("link").text();
				console.log(titles+'-----');
				$("#noticecon").find('ol').append('<li><a href="'+links+'">'+titles+'</a></li>');
			});
		}
	});
}) 
</script>

  <div id="noticecon">
		<ol>
		</ol>
	</div>

第二种方案:

<script type="text/javascript">
	$.get("https://3water.com/cgi/test.xml", function(data){
		$(data).find('channel').find('item').each(function(index, ele){
			var titles = $(ele).find('title').text();
			var links = $(ele).find('link').text();
			$("#noticecon").find('ol').append('<li><a href="'+links+'">'+titles+'</a></li>');
		})
	});
</script>

  <div id="noticecon">
		<ol>
		</ol>
	</div>

一般步骤如下:

1. 读取xml文件

$.get("xmlfile.xml",function(xml){
	//xml即为可以读取使用的内容,具体读取见第2点
});

2. 读取xml内容

如果读取的xml是来于xml文件,这结合上面的那点,处理如下:

$.get("xmlfile.xml",function(xml){  
	$(xml).find("item").length;  
});

如果读取的是xml字符串,则要注意一点,xml字符串的必然被"<xml>"和"</xml>"包围才可以被解析

$("<xml><root><item></item></root></xml>").find("item").length;

解析xml内容:

示例xml:

<?xml version="1.0" encoding="utf-8" ?>
<fields>
 <field Name="Name1">
  <fieldname>dsname</fieldname>
  <datatype>字符</datatype>
 </field>
 <field Name="Name2">
  <fieldname>dstype</fieldname>
  <datatype>字符</datatype>
 </field>
</fields>

以下是解析示例代码:

$(xml).find("field").each(function() {
	var field = $(this);
	var fName = field.attr("Name");//读取节点属性
	var dataType = field.find("datatype").text();//读取子节点的值
});

以上这篇JQuery解析XML数据的几个简单实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript 网页黑白效果实现代码(兼容IE/FF等)
Apr 23 Javascript
在JavaScript中实现类的方式探讨
Aug 28 Javascript
js根据日期判断星座的示例代码
Jan 23 Javascript
vue-axios使用详解
May 10 Javascript
jQuery 1.9版本以上的浏览器判断方法代码分享
Aug 28 jQuery
浅析Node.js非对称加密方法
Jan 29 Javascript
Angular项目如何升级至Angular6步骤全纪录
Sep 03 Javascript
小程序如何获取多个formId实现详解
Sep 20 Javascript
微信小程序 wxParse插件显示视频问题
Sep 27 Javascript
微信小程序换肤功能实现代码(思路详解)
Aug 25 Javascript
vue项目中播放rtmp视频文件流的方法
Sep 17 Javascript
js实现类选择器和name属性选择器的示例步骤
Feb 07 Javascript
JavaScript设计模式开发中组合模式的使用教程
May 18 #Javascript
设计模式中的组合模式在JavaScript程序构建中的使用
May 18 #Javascript
easyui window refresh 刷新两次的解决方法(推荐)
May 18 #Javascript
详解JavaScript设计模式开发中的桥接模式使用
May 18 #Javascript
jquery解析XML及获取XML节点名称的实现代码
May 18 #Javascript
Jquery跨域获得Json的简单实例
May 18 #Javascript
jQuery 获取跨域XML(RSS)数据的相关总结分析
May 18 #Javascript
You might like
ThinkPHP自动填充实现无限级分类的方法
2014/08/22 PHP
百度工程师讲PHP函数的实现原理及性能分析(二)
2015/05/13 PHP
php字符串函数 str类常见用法示例
2020/05/15 PHP
javascript 动态生成私有变量访问器
2009/12/06 Javascript
javascript getElementsByClassName函数
2010/04/01 Javascript
Nodejs实现的一个简单udp广播服务器、客户端
2014/09/25 NodeJs
JavaScript中的异常捕捉介绍
2014/12/31 Javascript
jquery+CSS3模拟Path2.0动画菜单效果代码
2015/08/31 Javascript
jQuery实现默认是闭合的FAQ展开效果菜单
2015/09/14 Javascript
jQuery实现可以控制图片旋转角度效果(附demo源码下载)
2016/01/27 Javascript
javascript使用Promise对象实现异步编程
2016/03/01 Javascript
JS实现为排序好的字符串找出重复行的方法
2016/03/02 Javascript
详解JavaScript对象类型
2016/06/16 Javascript
Angular企业级开发——MVC之控制器详解
2017/02/20 Javascript
Vue-cli-webpack搭建斗鱼直播步骤详解
2017/11/17 Javascript
基于JS实现带动画效果的流程进度条
2018/06/01 Javascript
Node.js中Koa2在控制台输出请求日志的方法示例
2019/05/02 Javascript
layui table 表格上添加日期控件的两种方法
2019/09/28 Javascript
js实现适配移动端的拖动效果
2020/01/13 Javascript
[01:09]DOTA2次级职业联赛 - 99战队宣传片
2014/12/01 DOTA
Python正则表达式教程之三:贪婪/非贪婪特性
2017/03/02 Python
Python数据分析之双色球中蓝红球分析统计示例
2018/02/03 Python
python实现beta分布概率密度函数的方法
2019/07/08 Python
Django在pycharm下修改默认启动端口的方法
2019/07/26 Python
Python爬虫HTPP请求方法有哪些
2020/06/03 Python
Python 串口通信的实现
2020/09/29 Python
编写一个类体现构造,公有,私有方法,静态,私有变量
2013/08/10 面试题
LINUX下线程,GDI类的解释
2012/04/17 面试题
历史系自荐信范文
2013/12/24 职场文书
销售主管岗位职责
2014/02/08 职场文书
美食节策划方案
2014/05/26 职场文书
优秀中职教师事迹材料
2014/08/26 职场文书
2014年社区卫生工作总结
2014/12/18 职场文书
财务出纳岗位职责
2015/03/31 职场文书
2015年国庆节广播稿
2015/08/19 职场文书
Golang日志包的使用
2022/04/20 Golang