1. 载入HTML文档
load()方法是jquery中最为简单和常用的ajax方法,能够载入远程HTML代码并插入DOM中,结构为:
load(url [, data] [ , callback])
参数名称 | 类型 | 说明 |
url | String | 请求HTML页面的URL地址 |
data(可选) | Object | 发送至服务器的key/value数据 |
callback(可选) | Function | 请求完成时的回调函数,无论请求成功与否 |
$(function () { $("#send").click(function () { $("#resText").load("load_test.html"); }); });
2. 筛选载入的HTML文档
通过为URL参数指定选择符,就可以方便的从加载过来的HTML文档里筛选出所需要的内容。
load方法的URL参数的语法结构为:“url selector”,
注意,URL和选择器之间有一个空格。
例如,只需要加载 test.html页面中的
class为“para”的内容,可以使用如下代码:
$("#resText").load("test.html .para");
3. 传递方式
load()方法的传递方式根据参数data来自动指定,如果没有参数传递,则采用“GET”方式传递,反之,则会自动转换为POST方式。
//无参数传递,则是GET方式 $("#resText").load("test.php",function(){ //... }); //有参数传递,则是POST方式 $("#resText").load("test.php",{name:"rain",age:"22"},function(){ //... });
4. 回调参数
在load()中,
无论Ajax请求是否成功,只要当请求完成(complete)后,回调函数(callback)就会被触发。
$("#resText").load("test.html",function(responseText,textStatus,XMLHttpRequest){ //responseText: 请求返回的内容 //textStatus: 请求状态:success、error、notmodified、timeout 4种 //XMLHttpRequest: XMLHttpRequest对象 });
[参考文献]
- 单东林,张晓菲. 锋利的jQuery(第二版).