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的加载和解析的更多相关文章

  1. Tomcat源码分析——SERVER.XML文件的加载与解析

    前言 作为Java程序员,对于Tomcat的server.xml想必都不陌生.本文基于Tomcat7.0的Java源码,对server.xml文件是如何加载和解析的进行分析. 加载 server.xm ...

  2. web.xml文件加载顺序

    1.启动一个WEB项目的时候,WEB容器会去读取它的配置文件web.xml,读取<listener>和<context-param>两个结点. 2.紧急着,容创建一个Servl ...

  3. HTML文档、javascript脚本的加载与解析

    1.onload事件 1.1 onload事件分类 a.文档加载完成事件(包括脚本.图片等资源都加载完),绑定方法:<body onload="doSomething()"& ...

  4. 前端笔记之jQuery（上）加载函数的区别&对象&操作HTML/CSS&动画&选择器

    一.jQuery简介 1.0 JavaScript编程比较恶心的地方 恶心1:选择元素麻烦,全线兼容的方法只有getElementById()和getElementsByTagName()两个.其他的 ...

  5. js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的

    js/jquery控制页面动态加载数据 滑动滚动条自动加载事件--转他人的 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多 有手机的相信都见过这样 ...

  6. 使用jQuery实现图片懒加载原理

    原文:https://www.liaoxuefeng.com/article/00151045553343934ba3bb4ed684623b1bf00488231d88d000 在网页中,常常需要用 ...

  7. Bean Definition从加载、解析、处理、注册到BeanFactory的过程。

    为了弄清楚Bean是怎么来的,花费了大把功夫,现在要把Bean Definition的加载.解析.处理.注册到bean工厂的过程记下来.这只是bean definition 的加载.解析.处理.注册过 ...

  8. jquery实现图片预加载

    使用jquery实现图片预加载提高页面加载速度和用户体,本就为大家详细分析jquery图片预加载的实现原理. 什么时候使用图片预加载? 如果页面使用了很多不是最初加载便可见的图片,有必要进行预加载: ...

  9. web.xml 的加载过程

    初始化过程: 在启动Web项目时,容器(比如Tomcat)会读web.xml配置文件中的两个节点<listener>和<contex-param>. 接着容器会创建一个Serv ...

随机推荐

  1. SCRIPT5011:不能执行已释放Script的代码

    环境:win7 64位 IE9 错误:SCRIPT5011:不能执行已释放Script的代码. 现象:在父窗体的close()中调用嵌套的iframe页面的js方法返回一个对象时抛此异常. 原因:在一 ...

  2. Github+hexo绑定域名

    Github绑定域名 近期在新网购买了一个属于自己的域名,因此想着把自己用hexo+github搭建的博客通过域名访问,但是找了n长时间来搞,都没有成功.心灰意冷之中再次通过google来搜索,终于有 ...

  3. Feathers UI 性能优化

    Feathers UI作者写的 http://joshblog.net/2013/feathers-performance-tips/

  4. MySQL学习笔记之数据类型

    数据类型在所有的数据库使用当中,都是避免不了的部分.以前每次写SQL语句,对于定义成哪种数据类型总是迷迷糊糊,今天就来彻底弄清.以下介绍仅针对MySQL 5.5以上版本. 一.字符串类型 1.char ...

  5. SQL Server 列存储索引强化

    SQL Server 列存储索引强化 SQL Server 列存储索引强化 1. 概述 2.背景 2.1 索引存储 2.2 缓存和I/O 2.3 Batch处理方式 3 聚集索引 3.1 提高索引创建 ...

  6. 使用NetBeans、Eclipse阅读JDK源码

    下面说明在Netbeans.Eclipse环境下怎么查看JDK源码: Netbeans: 在"工具->java平台->源"里添加下路径,如果你安装jdk的时候选择安装了 ...

  7. 使用Echarts实现动态曲线图表

    最近做的一个在线气象观测网站要实现一个需求:使用图表展示最近五天温湿度等气象要素的曲线变化 具体效果参考:http://www.weatherobserve.com/showInfoIndex.jsp ...

  8. Python写地铁的到站的原理简易版

    Python地铁的到站流程及原理(个人理解) 今天坐地铁看着站牌就莫名的想如果用Python写其工作原理 是不是很简单就小试牛刀了下大佬们勿喷纯属小弟个人理解 首先来看看地铁上显示的站牌如下: 就想这 ...

  9. 【推荐】CentOS安装vsftpd-3.0.2+安全配置

    注:以下所有操作均在CentOS 6.5 x86_64位系统下完成. FTP的登录一般有三种方式,分别是: 匿名用户形式:默认安装的情况下,系统只提供匿名用户访问,只需要输入用户anonymous/f ...

  10. java实现批量下载百度图片搜索到的图片

    就是写的个小程序,用于记录一下,方便后续查看,首先感谢下面这个博客,从这篇文章衍生的吧,大家可以学习下: http://www.cnblogs.com/lichenwei/p/4610298.html ...