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 相关文章推荐
学习ExtJS fit布局使用说明
Oct 08 Javascript
Jquery拖拽并简单保存的实现代码
Nov 28 Javascript
js实现用户注册协议倒计时的方法
Jan 21 Javascript
JS实现仿中关村论坛评分后弹出提示效果的方法
Feb 23 Javascript
JavaScript中property和attribute的区别详细介绍
Mar 03 Javascript
详解JavaScript数组和字符串中去除重复值的方法
Mar 07 Javascript
jQuery Ajax 实现在html页面实时显示用户登录状态
Dec 30 Javascript
angularjs实现的前端分页控件示例
Feb 10 Javascript
JavaScript 过滤关键字
Mar 20 Javascript
关于bootstrap日期转化,bootstrap-editable的简单使用,bootstrap-fileinput的使用详解
May 12 Javascript
基于jstree使用AJAX请求获取数据形成树
Aug 29 Javascript
JS实现的RC4加密算法示例
Aug 16 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中如何直接执行SHELL
2013/06/28 PHP
PHP生成制作验证码的简单实例
2016/06/12 PHP
php一个文件搞定微信jssdk配置
2016/12/12 PHP
php和vue配合使用技巧和方法
2019/05/09 PHP
JS仿flash上传头像效果实现代码
2011/07/18 Javascript
原生JS实现表单checkbook获取已选择的值
2013/07/21 Javascript
jQuery探测位置的提示弹窗(toolTip box)详细解析
2013/11/14 Javascript
jquery常用特效方法使用示例
2014/04/25 Javascript
JavaScript中跨域调用Flash的方法
2014/08/11 Javascript
一张Web前端的思维导图分享
2015/07/03 Javascript
javascript获取网页宽高方法汇总
2015/07/19 Javascript
jQuery+PHP实现可编辑表格字段内容并实时保存
2015/10/09 Javascript
javascript简单判断输入内容是否合法的方法
2016/05/11 Javascript
浅谈String.valueOf()方法的使用
2016/06/06 Javascript
简单的JS轮播图代码
2016/07/18 Javascript
JS实现将Asp.Net的DateTime Json类型转换为标准时间的方法
2016/08/02 Javascript
JQuery Ajax动态加载Table数据的实例讲解
2018/08/09 jQuery
对angularjs框架下controller间的传值方法详解
2018/10/08 Javascript
JS重学系列之聊聊new操作符
2019/03/04 Javascript
微信小程序+云开发实现欢迎登录注册
2019/05/24 Javascript
Python命令行参数解析模块getopt使用实例
2015/04/13 Python
详解Python迭代和迭代器
2016/03/28 Python
Python中如何获取类属性的列表
2016/12/26 Python
使用TensorFlow实现二分类的方法示例
2019/02/05 Python
python使用 __init__初始化操作简单示例
2019/09/26 Python
详解基于python的多张不同宽高图片拼接成大图
2019/09/26 Python
CSS3 开发工具收集
2010/04/17 HTML / CSS
HTML5 video 上传预览图片视频如何设置、预览视频某秒的海报帧
2018/08/28 HTML / CSS
Farah官方网站:男士服装及配件
2019/11/01 全球购物
公司道歉信范文
2014/01/09 职场文书
红色故事演讲稿
2014/05/22 职场文书
商场消防安全责任书
2014/07/29 职场文书
自主招生学校推荐信范文
2015/03/26 职场文书
小学教师教育随笔
2015/08/14 职场文书
python基础入门之字典和集合
2021/06/13 Python
nginx共享内存的机制详解
2022/03/21 Servers