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 相关文章推荐
ExtJs的Date格式字符代码
Dec 30 Javascript
jquery常用特效方法使用示例
Apr 25 Javascript
JavaScript获取当前日期是星期几的方法
Apr 06 Javascript
avalon js实现仿微博拖动图片排序
Aug 14 Javascript
基于JavaScript实现高德地图和百度地图提取行政区边界经纬度坐标
Jan 22 Javascript
JS表单数据验证的正则表达式(常用)
Feb 18 Javascript
jQuery获取table表中的td标签(实例讲解)
Jul 28 jQuery
基于jquery的on和click的区别详解
Jan 15 jQuery
Vue 路由 过渡动效 数据获取方法
Jul 31 Javascript
layer父页获取弹出层输入框里面的值方法
Sep 02 Javascript
Object.keys() 和 Object.getOwnPropertyNames() 的区别详解
May 21 Javascript
vue cli4中mockjs在dev环境和build环境的配置详情
Apr 06 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
基于mysql的bbs设计(一)
2006/10/09 PHP
Dedecms V3.1 生成HTML速度的优化办法
2007/03/18 PHP
php session 预定义数组
2009/03/16 PHP
PHP的范围解析操作符(::)的含义分析说明
2011/07/03 PHP
支持中文的php加密解密类代码
2011/11/27 PHP
PHP中soap的用法实例
2014/10/24 PHP
圣诞节Merry Christmas给博客添加浪漫的下雪效果基于jquery实现
2012/12/27 Javascript
js异常捕获方法介绍
2013/04/10 Javascript
禁用页面部分JavaScript方法的具体实现
2013/07/31 Javascript
图片放大镜jquery.jqzoom.js使用实例附放大镜图标
2014/06/19 Javascript
JavaScript中提前声明变量或函数例子
2014/11/12 Javascript
JS中字符串trim()使用示例
2015/05/26 Javascript
AngularJS中实现显示或隐藏动画效果的方式总结
2015/12/31 Javascript
用 js 的 selection range 操作选择区域内容和图片
2017/04/18 Javascript
JQuery Ajax执行跨域请求数据的解决方案
2018/12/10 jQuery
React如何实现浏览器打印部分内容详析
2019/05/19 Javascript
JavaScript 继承 封装 多态实现及原理详解
2019/07/29 Javascript
基于JavaScript实现表格隔行换色
2020/05/08 Javascript
NodeJS多种创建WebSocket监听的方式(三种)
2020/06/04 NodeJs
token 机制和实现方式
2020/12/15 Javascript
[05:59]带你看看DPC的台前幕后
2021/03/11 DOTA
python迭代器的使用方法实例
2013/11/21 Python
Python回调函数用法实例详解
2015/07/02 Python
Windows平台Python连接sqlite3数据库的方法分析
2017/07/12 Python
python实现百万答题自动百度搜索答案
2018/01/16 Python
Linux系统(CentOS)下python2.7.10安装
2018/09/26 Python
Python数据正态性检验实现过程
2020/04/18 Python
HTML5的标签的代码的简单介绍 HTML5标签的简介
2012/05/28 HTML / CSS
Canvas绘制浮动球效果的示例
2017/12/29 HTML / CSS
英国索普公园票务和酒店套餐:Thorpe Breaks
2019/09/14 全球购物
客服服务心得体会
2013/12/30 职场文书
幼儿园小班工作总结2015
2015/04/25 职场文书
2016春季幼儿园小班开学寄语
2015/12/03 职场文书
2016三严三实专题教育活动心得体会
2016/01/06 职场文书
导游词之唐山景点
2019/12/18 职场文书
Python OpenCV实现图像模板匹配详解
2022/04/07 Python