最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
jquery读取并显示xml内容的例子
时间：2014-08-20 编辑：简简单单 来源：一聚教程网
HTML部分
| 代码如下 | 复制代码 |
|
|
|
CSS样式
| 代码如下 | 复制代码 |
JS部分
| 代码如下 | 复制代码 |
XML部分
| 代码如下 | 复制代码 |
|
|
|
在实例应用中ajax读取xml会比较常用，下面我们也来看个例子
首先建立一个XML文档,名字随便取就可以了.这里我就用test.xml给大家做示范了.
XML内容为:
| 代码如下 | 复制代码 |
|
|
|
好了这样就算是一个比较完整的XML文档了.
下面就看我们要写的JS.
既然是jQuery最重要的就是要将jQuery库引入进来.
没有 jQuery的朋友可去jquery.com下载最新版本.这里就以我本机的路径为例.
接下来就是读取XML文件了.前面我们已经说过了要用ajax所以这里代码就应该是这样:
| 代码如下 | 复制代码 |
|
|
|
第一句就不用跟大家解释了,意思就是页面加载执行.我们也可以写在一个函数里.
$ajax()有很多参数,这里就只给大家介绍我写的这几个参数是什么意思.
参数1 url:要请求的文档路径.
参数2 dataType:请求的文档类型.有 XML HTML script json等等.
参数3 success:请求成功后的回调函数。也就是说,当你发送的请求成功之后你要做什么.
接下来我给大家解释一下这段代码
function(xml) function相信大家都知道是干什么的,这里的xml指的是你请求文件完成后返回的所有数据.
$(xml).find("stulist>man").each这句的意思就是查找返回的xml里的stulist节点下的man标签.然后根据查找到的结果,每一个跟查找结果匹配的元素都执行下文的函数.
下边就更好理解了,然后在你查找到的结果里,继续查找你想要的元素,然后将你得到的值,一个个inner到需要显示的元素里.OK就这样,我们读取XML就成功了.
相关文章
- HTML简单购物数量小程序代码展示 10-31
- html canvas实现弹幕功能 10-31
- HTML中空格表示的意义 10-31
- html area标签解读 10-31
- html使用表单标签实现注册页面代码展示 10-31
- 使用HTML截图并保存为本地图片的代码展示 10-31