jQuery之XML的加载和解析
1.XML(eXtensible Markup Language)即可扩展标记语言,与HTML一样,都是SGML标准通用语言。语法如下:
- 任何起始标签都必须有一个结束标签。
- 可以采用另一种简化语法,即在一个标签中同时表示起始和结束标签。这种语法是在右边闭合尖括号之前紧跟一个斜线(/),例如<tag/>。XML解析器会将其翻译成<tag></tag>。
- 标签必须按照合理的顺序进行嵌套,因此结束标签必须按镜像顺序匹配起始标签。
- 所有属性都需要有值,并且需要在值的周围加上双引号。
2.Content-Type:很多情况下XML文件不能征程解析都是由于Content-Type没有设置好。如果Content-Type本身就是一个XML文件则不需要设置;如果是由后台程序动态生成的,那么就需要设置Content-Type为“text/xml”,否则jQuery会以默认的“text/html”方式处理,导致解析失败,下面介绍几种常见的语言中Content-Type的设置。
header("Content-Type : text/xml"); //PHP
response.ContentType = "text/xml"; //ASP
response.setContentType("text/xml"); //JSP
3.XML结构:作为一个标准的XML,必须要遵循严格的格式规定,其中最重要的一条规则就是XML必须是封闭的。XML文档只能有一个顶层元素。下面展示一个正确的XML。
<?xml version="1.0" encoding="UTF-8"?>
<stulist>
<student email="1@1.com">
<name>zhangsan</name>
<id>1</id>
</student>
<student email="2@2.com">
<name>lisi</name>
<id>2</id>
</student>
</stulist>
4.获取并解析XML,这里是通过Ajax函数进行读取。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
</head>
<body>
<input type="button" id="getXml" value="获取和解析xml"/>
<div id="load"></div>
</body> <script type="text/javascript">
$(function(){
$("#getXml").click(function(){
$.ajax({
type:"get",
url:"file/test.xml",//这里通过设置url属性来获取xml
dataType:"xml",
timeout:1000, //设定超时
cache:false, //禁用缓存
success:function(xml){//这里是解析xml
var frag = $("<ul/>"); //建立一个代码片段
$(xml).find("student").each(function(i){
var id = $(this).children("id"); //获取id节点
id_value = id.text(); //获取节点文本
email = $(this).attr("email"); //获取student下的email属性
//构造html字符串,通过append()方法添加到之前建立的代码段
frag.append("<li>姓名:"+id_value+"---邮箱:"+email+"</li>");
});
frag.appendTo("#load");
}
});
})
})
</script>
</html>
5.效果展示,当我点击“获取和解析xml”按钮时会在一个div里面添加一些html元素,里面的值就是xml文档中的内容。

jQuery之XML的加载和解析的更多相关文章
- Tomcat源码分析——SERVER.XML文件的加载与解析
前言 作为Java程序员,对于Tomcat的server.xml想必都不陌生.本文基于Tomcat7.0的Java源码,对server.xml文件是如何加载和解析的进行分析. 加载 server.xm ...
- web.xml文件加载顺序
1.启动一个WEB项目的时候,WEB容器会去读取它的配置文件web.xml,读取<listener>和<context-param>两个结点. 2.紧急着,容创建一个Servl ...
- HTML文档、javascript脚本的加载与解析
1.onload事件 1.1 onload事件分类 a.文档加载完成事件(包括脚本.图片等资源都加载完),绑定方法:<body onload="doSomething()"& ...
- 前端笔记之jQuery(上)加载函数的区别&对象&操作HTML/CSS&动画&选择器
一.jQuery简介 1.0 JavaScript编程比较恶心的地方 恶心1:选择元素麻烦,全线兼容的方法只有getElementById()和getElementsByTagName()两个.其他的 ...
- js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的
js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...
- 使用jQuery实现图片懒加载原理
原文:https://www.liaoxuefeng.com/article/00151045553343934ba3bb4ed684623b1bf00488231d88d000 在网页中,常常需要用 ...
- Bean Definition从加载、解析、处理、注册到BeanFactory的过程。
为了弄清楚Bean是怎么来的,花费了大把功夫,现在要把Bean Definition的加载.解析.处理.注册到bean工厂的过程记下来.这只是bean definition 的加载.解析.处理.注册过 ...
- jquery实现图片预加载
使用jquery实现图片预加载提高页面加载速度和用户体,本就为大家详细分析jquery图片预加载的实现原理. 什么时候使用图片预加载? 如果页面使用了很多不是最初加载便可见的图片,有必要进行预加载: ...
- web.xml 的加载过程
初始化过程: 在启动Web项目时,容器(比如Tomcat)会读web.xml配置文件中的两个节点<listener>和<contex-param>. 接着容器会创建一个Serv ...
随机推荐
- iOS之APP应用图标的设置
图标是IOS程序包所必需的组成部分.如果你没有提供程序所需的各种尺寸的图标,程序上传发布时可能会无法通过验证.IOS程序为兼顾不同的应用场景,定义了多个不同规格的图标,并以不同的命名区分: IOS图标 ...
- C#操作Excell常用方法
这是在博客园看的文章,写的很好,所以转一下,方便自己以后用到的时候可以随时查看. range.NumberFormatLocal = "@"; //设置单元格格式为文本 r ...
- 移动端App广告常见的10种形式
什么是App广告? App广告,或称In-App广告,是指智能手机和平板电脑这类移动设备中第三方应用程序内置广告,属于移动广告的子类别. App广告兴起得益于其载体—App的风行.平板电脑和大屏触 ...
- Github+hexo绑定域名
Github绑定域名 近期在新网购买了一个属于自己的域名,因此想着把自己用hexo+github搭建的博客通过域名访问,但是找了n长时间来搞,都没有成功.心灰意冷之中再次通过google来搜索,终于有 ...
- 源代码管理工具之SVN
源代码管理工具SVN是一款非常强大的源代码管理工具,现在国内70%-90%的公司都在使用SVN来管理源代码,下面就让小编给大家着重介绍一下SVN的使用,SVN的使用主要分为下面几块. SVN的使用环境 ...
- Linux系统内存占用90%以上 ?
问题: [root@dbserver01 zx_epp_db]# free -m total used free shared buffers cached Mem: 15953 14706 1246 ...
- Windows on Device 项目实践 4 - 智能风扇制作
在前面的文章中,我们已经学习并且利用Intel Galileo开发板和Windows on Device制作了火焰报警器.感光灯和PWM调光灯.在这个项目中,我们来利用温度传感器和直流电机,完成一个简 ...
- vs.net Web.csproj.webinfo文件
使用VS工具打开工程的时候,请直接打开BookShop.sln文件, 请修改WEB/Web.csproj.webinfo文件中的<Web URLPath = "http://local ...
- Nova Suspend/Rescue 操作详解 - 每天5分钟玩转 OpenStack(35)
本节我们讨论 Suspend/Resume 和 Rescue/Unrescue 这两组操作. Suspend/Resume 有时需要长时间暂停 instance,可以通过 Suspend 操作将 in ...
- CML相关
!!:执行上一条命令 !blah:执行最近的以 blah 开头的命令,如 !ls !blah:p:仅打印输出,而不执行 !$:上一条命令的最后一个参数,与 Alt + . 相同 !$:p:打印输出 ! ...