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 相关文章推荐
js静态作用域的功能。
Dec 25 Javascript
页面版文本框智能提示JS代码
Nov 20 Javascript
Jquery实现侧边栏跟随滚动条固定(兼容IE6)
Apr 02 Javascript
详解JavaScript数组的操作大全
Oct 19 Javascript
jquery模拟多级复选框效果的简单实例
Jun 08 Javascript
Js操作DOM元素及获取浏览器高宽的简单方法
Sep 08 Javascript
35个最好用的Vue开源库(史上最全)
Jan 03 Javascript
详解Element 指令clickoutside源码分析
Feb 15 Javascript
JavaScript数组去重的方法总结【12种方法,号称史上最全】
Feb 28 Javascript
Vue组件通信$attrs、$listeners实现原理解析
Sep 03 Javascript
详解TS数字分隔符和更严格的类属性检查
May 06 Javascript
JS前端canvas交互实现拖拽旋转及缩放示例
Aug 05 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
discuz程序的PHP加密函数原理分析
2011/08/05 PHP
如何解决PHP使用mysql_query查询超大结果集超内存问题
2016/03/14 PHP
Yii2实现ajax上传图片插件用法
2016/04/28 PHP
总结PHP删除字符串最后一个字符的三种方法
2016/08/30 PHP
一个简单的JS鼠标悬停特效具体方法
2013/06/17 Javascript
jquery下div 的resize事件示例代码
2014/03/09 Javascript
Chrome下ifame父窗口调用子窗口的问题示例探讨
2014/03/17 Javascript
JavaScript事件委托实例分析
2015/05/26 Javascript
jquery实现多条件筛选特效代码分享
2015/08/28 Javascript
javascript针对不确定函数的执行方法
2015/12/16 Javascript
原生js获取浏览器窗口及元素宽高常用方法集合
2017/01/18 Javascript
jQuery实现简单的滑动导航代码(移动端)
2017/05/22 jQuery
JavaScript实现简单进度条效果
2020/03/25 Javascript
VSCode搭建React Native环境
2020/05/07 Javascript
python操作mysql中文显示乱码的解决方法
2014/10/11 Python
深入讨论Python函数的参数的默认值所引发的问题的原因
2015/03/30 Python
Python向日志输出中添加上下文信息
2017/05/24 Python
Python 类的特殊成员解析
2018/06/20 Python
Python求一批字符串的最长公共前缀算法示例
2019/03/02 Python
python基础教程之while循环
2019/08/14 Python
详解从Django Allauth中进行登录改造小结
2019/12/18 Python
np.dot()函数的用法详解
2020/01/17 Python
python日期与时间戳的各种转换示例
2020/02/12 Python
基于pytorch padding=SAME的解决方式
2020/02/18 Python
解决pip install psycopg2出错问题
2020/07/09 Python
使用python tkinter开发一个爬取B站直播弹幕工具的实现代码
2021/02/07 Python
windeln官方海外旗舰店:德淘超人气母婴超市
2017/12/15 全球购物
捷克母婴用品购物网站:Feedo.cz
2020/12/28 全球购物
JVM是一个编译程序还是解释程序
2012/09/11 面试题
婚礼主持词
2014/03/13 职场文书
2015年办公室主任工作总结
2015/04/09 职场文书
迎新年主持词
2015/07/06 职场文书
解决numpy数组互换两行及赋值的问题
2021/04/17 Python
从np.random.normal()到正态分布的拟合操作
2021/06/02 Python
mysq启动失败问题及场景分析
2021/07/15 MySQL
java objectUtils 使用可能会出现的问题
2022/02/28 Java/Android