jQuery ajax - 如何使用XML

我在日志里介绍了很多使用jQuey load的方法来实现ajax。load()应该是jQuery里ajax的最简单的运用了,你不用了解ajax是怎么一回事,就可以把某个脚本的输出(通常是text/html类型)动态的赋给页面的某个元素(例如div和p)。但是在实际的运用中,你可能会发现load()常常不能满足要求,例如:你想对一个表单的多个控件使用ajax进行更新,可是load()一次只可以对其中一个控件起作用;如果使用多个load(),那么会增加服务器的负荷,因此肯定不是一个好办法。本文要介绍jQuery的ajax()方法,它是类似传统的ajax方法。jQuery的ajax()方法涉及的知识点很多,具体可以参考jQuery中文参考文档。这里要介绍的是如何使用XML数据类型以及如何对XML进行读取。

1.使用PHP输出XML,如果你只是使用echo,那么要注意要先输出正确的header: Content-Type是text/xml。如果你要给XML的某个节点用HTML代码赋值,你必须把HTML放在<![CDATA[" 和"]]>之间。例子如下: genXML.php

<?php
echo "header("Content-Type: text/xml; charset=UTF-8");";
echo <<< XML
<?xml version="1.0" encoding="UTF-8"?>
<rsp>
<name>Adam</name>
<site>http://www.61dh.com</site>
<note>
<![CDATA[
HTML代码可以放在这里
]]>
</note>
</rsp>
XML;
?>2. HTML样本:

<div id="name"></div>
<div id="note"></div>3.接下来我们要使用jQuery的ajax()方法,读取genXML.php的输出(xml),然后把相关节点的内容赋给HTML元素:#name和#node。代码如下:

$.ajax({
url: "genXML.php", //本例中,url为genXML.php
type: 'GET', //根据实际情况,可以是'POST'或者'GET'
//data: "name=adam&location=61dh",本例中没有用到data
dataType: 'xml', //指定数据类型
timeout: 1000, //设置超时1000 = 1秒
error: function(){
alert('Error loading XML document'); }, //错误提示
success: function(xml){ //ajax请求成功后 do something with xml
//把XML的相关节点值赋给HTML里相关ID
$('#name').html($(xml).find('name').text());
$('#note').html($(xml).find('note').text());
}
});我在上面的代码里已经做了比较详细地注释,值得再提的是使用jQuery提供find()的方法可以很简单的读取XML某个节点的值,例如:$(xml).find('name').text(); //读取节点name;然后使用html()的方法赋值给HTML里的某个元素。

注: 我在日志里写了很多有关jQuery的文章而且还挺受欢迎:-),所以我把它专门作为一个菜单放在上方导航条里。希望这些文章对jQuery初学者有所帮助。如果你有任何的问题和建议,请给我留言或者发Email。谢谢!
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值