jQuery xml字符串的解析、读取及查找方法


Posted in Javascript onMarch 01, 2016

本文实例讲述了jQuery xml字符串的解析、读取及查找方法。分享给大家供大家参考,具体如下:

xml字符串的解析

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
  $(function () {
    var xml = '<markers>';
    xml += '<marker carId="1" carName="SHANGHAI" gpsTime="2011-08-26 21:21:11.0" lat="31.230393" lng="121.473704" direction="222" speed="22" />';
    xml += '<marker carId="7" carName="XIAMEN" gpsTime="2011-08-26 21:21:11.0" lat="24.479836" lng="118.089421" direction="222" speed="22" />';
    xml += '</markers>';
    var xmlDoc = $.parseXML(xml);
    var result="";
    $(xmlDoc).find("markers marker").each(function () {
      result += "carId = " + $(this).attr("carId")
        + " ;carName =" + $(this).attr("carName")
        + " ;gpsTime =" + $(this).attr("gpsTime") + "\n";
    });
    alert(result);
  });
</script>
</head>
<body>
</body>
</html>

请求

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>无标题页</title>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
function search() {
  var searchStrLow = $("#txtTitle").val().toLowerCase();
  $.post("1.xml", function(data) {
    var html = "";
    $(data).find('book').each(function() {
      var titleLow = $(this).find("title").text().toLowerCase();
      if (titleLow.indexOf(searchStrLow)!=-1) {
        html += "<tr><td>" + $(this).find("title").text() + "</td>";
        html += "<td>" + $(this).find("author").text() + "</td>";
        html += "<td>" + $(this).find("year").text() + "</td></tr>";
        $("#tbody1").html(html);
      }
    });
  });
}
</script>
</head>
<body>
  <span>输入标题:</span><input id="txtTitle" type="text" />
  <input id="Button1" type="button" value="搜索" onclick="search()" />
  <table style="width: 100%;">
    <thead><tr><td>Title</td><td>Author</td><td>Year</td></tr></thead>
    <tbody id="tbody1">
    </tbody>
  </table>
</body>
</html>

xml:

<?xml version="1.0" encoding="utf-8" ?>
<bookstore>
<book id="No1">
  
<title>An Introduction to XML</title>
  
<author>Chunbin</author>
  
<year>2010</year>
  
<price>98.0</price>
  </book>

<book id="No2">
  
<title>The Performance of DataBase</title>
  
<author>John</author>
  
<year>1996</year>
  
<price>56.0</price>
  </book>
</bookstore>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
使用javascript实现有效时间的控制,并显示将要过期的时间
Jan 02 Javascript
每天一篇javascript学习小结(Array数组)
Nov 11 Javascript
Bootstrap弹出框(modal)垂直居中的问题及解决方案详解
Jun 12 Javascript
前端面试题及答案整理(二)
Aug 26 Javascript
最全面的百度地图JavaScript离线版开发
Sep 10 Javascript
node操作mysql数据库实例详解
Mar 17 Javascript
JS库particles.js创建超炫背景粒子插件(附源码下载)
Sep 13 Javascript
在vue中实现简单页面逆传值的方法
Nov 27 Javascript
JavaScript使用indexOf()实现数组去重的方法分析
Sep 04 Javascript
微信小程序实现watch监听
Jun 04 Javascript
Vue单页面应用中实现Markdown渲染
Feb 14 Vue.js
浅谈Vue的computed计算属性
Mar 21 Vue.js
原生javascript实现解析XML文档与字符串
Mar 01 #Javascript
JS创建对象几种不同方法详解
Mar 01 #Javascript
jQuery中通过ajax的get()函数读取页面的方法
Feb 29 #Javascript
基于JavaScript实现文字超出部分隐藏
Feb 29 #Javascript
基于JavaScript实现百叶窗动画效果不只单纯flas可以实现
Feb 29 #Javascript
ClearTimeout消除闪动实例代码
Feb 29 #Javascript
JavaScript实现点击按钮字体放大、缩小
Feb 29 #Javascript
You might like
php htmlentities和htmlspecialchars 的区别
2008/08/18 PHP
php实现只保留mysql中最新1000条记录
2015/06/18 PHP
初窥JQuery(二) 事件机制(1)
2010/11/25 Javascript
js的压缩及jquery压缩探讨(提高页面加载性能/保护劳动成果)
2013/01/29 Javascript
jQuery中on()方法用法实例
2015/01/19 Javascript
javascript查询字符串参数的方法
2015/01/28 Javascript
javascript学习小结之prototype
2015/12/03 Javascript
jQuery实现的指纹扫描效果实例(附演示与demo源码下载)
2016/01/26 Javascript
基于Javascript实现返回顶部按钮
2016/02/29 Javascript
javascript正则表达式之分组概念与用法实例
2016/06/16 Javascript
JS中innerHTML和pasteHTML的区别实例分析
2016/06/22 Javascript
javascript中call,apply,bind函数用法示例
2016/12/19 Javascript
5种JavaScript脚本加载的方式
2017/01/16 Javascript
TypeScript入门-基本数据类型
2017/03/28 Javascript
Three.js如何实现雾化效果示例代码
2017/09/27 Javascript
Vue2.0 实现移动端图片上传功能
2018/05/30 Javascript
vue解决弹出蒙层滑动穿透问题的方法
2018/09/22 Javascript
详解vue中v-bind:style效果的自定义指令
2020/01/21 Javascript
Vue-resource安装过程及使用方法解析
2020/07/21 Javascript
[55:48]VGJ.S vs TNC Supermajor 败者组 BO3 第二场 6.6
2018/06/07 DOTA
浅谈python装饰器探究与参数的领取
2017/12/01 Python
python Flask实现restful api service
2017/12/04 Python
python机器学习实战之K均值聚类
2017/12/20 Python
基于Python的文件类型和字符串详解
2017/12/21 Python
pymongo中聚合查询的使用方法
2019/03/22 Python
Python为何不能用可变对象作为默认参数的值
2019/07/01 Python
使用python代码进行身份证号校验的实现示例
2019/11/21 Python
英国和世界各地鲜花速递专家:Arena Flowers
2018/02/10 全球购物
L*SPACE官网:比基尼、泳装和度假服装
2019/03/18 全球购物
英国门把手公司:Door Handle Company
2019/05/12 全球购物
英国豪华家具和经典家居饰品购物网站:OKA
2020/06/05 全球购物
建筑总经理岗位职责
2014/02/02 职场文书
二年级小学生评语
2014/04/21 职场文书
派出所所长先进事迹
2014/05/19 职场文书
《自己去吧》教学反思
2016/02/16 职场文书
《狼王梦》读后感:可怜天下父母心
2019/11/01 职场文书