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 相关文章推荐
基于jquery的自定义鼠标提示效果 jquery.toolTip
Nov 14 Javascript
50个比较实用jQuery代码段
Sep 18 Javascript
原生js ActiveXObject获取execl里面的值
Nov 01 Javascript
原生javascript实现简单的datagrid数据表格
Jan 02 Javascript
javascript中substring()、substr()、slice()的区别
Aug 30 Javascript
Bootstrap的Refresh Icon也spin起来
Jul 13 Javascript
浅谈angular懒加载的一些坑
Aug 20 Javascript
Bootstrap table使用方法详细介绍
Dec 09 Javascript
javascript实现最长公共子序列实例代码
Feb 05 Javascript
微信小程序调用微信支付接口的实现方法
Apr 29 Javascript
Vue实现点击导航栏当前标签后变色功能
Aug 19 Javascript
如何搭建一个完整的Vue3.0+ts的项目步骤
Oct 18 Javascript
原生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实现网上点歌(二)
2006/10/09 PHP
php源代码安装常见错误与解决办法分享
2013/05/28 PHP
php 邮件发送问题解决
2014/03/22 PHP
采用thinkphp自带方法生成静态html文件详解
2014/06/13 PHP
php字符串替换函数substr_replace()用法实例
2015/03/17 PHP
thinkPHP3.1验证码的简单实现方法
2016/04/22 PHP
关于PHP5.6+版本“No input file specified”问题的解决
2019/12/11 PHP
ASP.NET中使用后端代码注册脚本 生成JQUERY-EASYUI的界面错位的解决方法
2010/06/12 Javascript
javascript中的作用域scope介绍
2010/12/28 Javascript
javascript window.confirm确认 取消对话框实现代码小结
2012/10/21 Javascript
javascript使用数组的push方法完成快速排序
2014/09/15 Javascript
在JavaScript中处理字符串之link()方法的使用
2015/06/08 Javascript
jquery 表单验证之通过 class验证表单不为空
2015/11/02 Javascript
jQuery实现form表单基于ajax无刷新提交方法详解
2015/12/08 Javascript
JavaScript中的子窗口与父窗口的互相调用问题
2017/02/08 Javascript
微信小程序 出现错误:{&quot;baseresponse&quot;:{&quot;errcode&quot;:-80002,&quot;errmsg&quot;:&quot;&quot;}}解决办法
2017/02/23 Javascript
Javascript中引用类型传递的知识点小结
2017/03/06 Javascript
Vue学习笔记之表单输入控件绑定
2017/09/05 Javascript
基于Vue2的独立构建与运行时构建的差别(详解)
2017/12/06 Javascript
Layer弹出层动态获取数据的方法
2018/08/20 Javascript
下载给定网页上图片的方法
2014/02/18 Python
pandas进行数据的交集与并集方式的数据合并方法
2018/06/27 Python
用Python配平化学方程式的方法
2019/07/20 Python
Django在pycharm下修改默认启动端口的方法
2019/07/26 Python
python-OpenCV 实现将数组转换成灰度图和彩图
2020/01/09 Python
python3.7调试的实例方法
2020/07/21 Python
Python+unittest+DDT实现数据驱动测试
2020/11/30 Python
自然健康的概念:Natural Healthy Concepts
2020/01/26 全球购物
北大青鸟学生求职信
2013/09/24 职场文书
中国梦演讲稿5分钟
2014/08/19 职场文书
个人三严三实对照检查材料
2014/09/25 职场文书
学校中秋节活动总结
2015/03/23 职场文书
中标通知书格式
2015/04/17 职场文书
2015年网管个人工作总结
2015/05/22 职场文书
医护人员继续教育学习心得体会
2016/01/19 职场文书
民警忠诚教育心得体会
2016/01/23 职场文书