jquery解析xml字符串示例分享


Posted in Javascript onMarch 25, 2014

第一种方案:

<script type="text/javascript">
$(document).ready(function() {
 $.ajax({
    url: 'http://www.test.net/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("http://www.test.net/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).find("item").length;    
});

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();//读取子节点的值
});
Javascript 相关文章推荐
javascript addBookmark 加入收藏 多浏览器兼容
Aug 15 Javascript
初窥JQuery(二) 事件机制(1)
Nov 25 Javascript
JavaScript的Module模式编程深入分析
Aug 13 Javascript
Jquery创建一个层当鼠标移动到层上面不消失效果
Dec 12 Javascript
JavaScript中原型和原型链详解
Feb 11 Javascript
jQuery实现的经典滑动门效果
Sep 22 Javascript
jquery validate表单验证的基本用法入门
Jan 18 Javascript
jQuery获得字体颜色16位码的方法
Feb 20 Javascript
jQuery复合事件用法示例
Jun 10 jQuery
使用vue-aplayer插件时出现的问题的解决
Mar 02 Javascript
浅谈Vuex注入Vue生命周期的过程
May 20 Javascript
Vue之beforeEach非登录不能访问的实现(代码亲测)
Jul 18 Javascript
jquery数组封装使用方法分享(jquery数组遍历)
Mar 25 #Javascript
jquery选择器原理介绍($()使用方法)
Mar 25 #Javascript
Jquery插件编写简明教程
Mar 25 #Javascript
jquery自动填充勾选框即把勾选框打上true
Mar 24 #Javascript
jquery默认校验规则整理
Mar 24 #Javascript
Javascript连接多个数组不用concat来解决
Mar 24 #Javascript
jqeury-easyui-layout问题解决方法
Mar 24 #Javascript
You might like
php引用返回与取消引用的详解
2013/06/08 PHP
跟我学Laravel之路由
2014/10/15 PHP
Laravel5.* 打印出执行的sql语句的方法
2017/07/24 PHP
js arguments.callee的应用代码
2009/05/07 Javascript
Javascript 文件夹选择框的两种解决方案
2009/07/01 Javascript
Prototype Template对象 学习
2009/07/19 Javascript
基于JQuery的列表拖动排序实现代码
2013/10/01 Javascript
原生js做的手风琴效果的导航菜单
2013/11/08 Javascript
jQuery Migrate 1.1.0 Released 注意事项
2014/06/14 Javascript
原生JS实现美图瀑布流布局赏析
2015/09/07 Javascript
jQuery实现倒计时重新发送短信验证码功能示例
2017/01/12 Javascript
jQuery实现字符串全部替换的方法【推荐】
2017/03/09 Javascript
jQuery实现简单的手风琴效果
2020/04/17 jQuery
IE11下使用canvas.toDataURL报SecurityError错误的解决方法
2017/11/19 Javascript
nodejs 最新版安装npm 的使用详解
2018/01/18 NodeJs
详解vue填坑之解决部分浏览器不支持pushState方法
2018/07/12 Javascript
浅谈vue引用静态资源需要注意的事项
2018/09/28 Javascript
微信小程序实现星级评价效果
2018/12/28 Javascript
nodejs同步调用获取mysql数据时遇到的大坑
2019/03/02 NodeJs
微信小程序实现上传多个文件 超过10个
2020/03/30 Javascript
ES11屡试不爽的新特性,你用上了几个
2020/10/21 Javascript
[02:32]DOTA2英雄基础教程 美杜莎
2014/01/07 DOTA
[02:55]含熏伴清风,风行者至宝、屠夫身心及典藏宝瓶二展示
2020/09/08 DOTA
python发送伪造的arp请求
2014/01/09 Python
python下paramiko模块实现ssh连接登录Linux服务器
2015/06/03 Python
使用Python实现BT种子和磁力链接的相互转换
2015/11/09 Python
Python的re模块正则表达式操作
2016/05/25 Python
python调用opencv实现猫脸检测功能
2019/01/15 Python
浅谈python之高阶函数和匿名函数
2019/03/21 Python
python lambda表达式在sort函数中的使用详解
2019/08/28 Python
Python爬虫使用浏览器cookies:browsercookie过程解析
2019/10/22 Python
通过实例解析python and和or使用方法
2020/11/14 Python
后勤工作职责
2013/12/22 职场文书
会计专业大学生职业生涯规划范文
2014/01/11 职场文书
2016年教师学习教师法心得体会
2016/01/20 职场文书
PHP使用非对称加密算法RSA
2021/04/21 PHP