一:jQuery AJAX 简介
AJAX 是与服务器交换数据的技术,它在不重载全部页面的情况下,实现了对部分网页的更新。
2.什么是 AJAX?
AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示。使用 AJAX 的应用程序案例:谷歌地图、腾讯微博、优酷视频、人人网等等。
3.jQuery 提供多个与 AJAX 有关的方法。
通过 jQuery AJAX 方法,您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON,同时您能够把这些外部数据直接载入网页的被选元素中。
注意:如果没有 jQuery,AJAX 编程还是有些难度的。编写常规的 AJAX 代码并不容易,因为不同的浏览器对 AJAX 的实现并不相同。这意味着您必须编写额外的代码对浏览器进行测试。不过,jQuery 团队为我们解决了这个难题,我们只需要一行简单的代码,就可以实现 AJAX 功能。
二:关于 jQuery 与 AJAX的方法
1.jQuery 提供多个与 AJAX 有关的方法。通过 jQuery AJAX 方法,您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时您能够把这些外部数据直接载入网页的被选元素中。
2.jQuery - AJAX load() 方法
(1)jQuery load() 方法:是简单但强大的 AJAX 方法。
load() 方法从服务器加载数据,并把返回的数据放置到指定的元素中。
注意:还存在一个名为 load 的 jQuery 事件方法。调用哪个,取决于参数。
语法1:
$(selector).load(url,data,function(response,status,xhr)
参数 | 描述 |
url | 必需。规定您需要加载的 URL。 |
data | 可选。规定连同请求发送到服务器的数据。 |
function(response,status,xhr) | 可选。规定 load() 方法完成时运行的回调函数。
|
语法2:
$(selector).load(URL,data,callback);
①必需的 URL 参数规定您希望加载的 URL。
②可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。可选的 callback 参数是 load() 方法完成后所执行的函数名称。
这是示例文件("demo_test.txt")的内容:
<h2>jQuery AJAX 是个非常棒的功能!</h2> <p id="p1">这是段落的一些文本。</p>
③也可以把 jQuery 选择器添加到 URL 参数。
下面的例子把 "demo_test.txt" 文件中 id="p1" 的元素的内容,加载到指定的 <div> 元素中:
实例
$("#div1").load("demo_test.txt #p1");
可选的 callback 参数规定当 load() 方法完成后所要允许的回调函数。回调函数可以设置不同的参数:
responseTxt - 包含调用成功时的结果内容
statusTXT - 包含调用的状态
xhr - 包含 XMLHttpRequest 对象