jQuery对ajax操作进行了封装，在jQuery中$.ajax()方法属于最底层的方法，第二层是load()、$.get()、$.post()方法，第3层是$.getScript()和$.getJSON()方法。
$.ajax()
$.ajax()方法是jQuery最底层的Ajax实现。
结构为：
$.ajax(options);
该方法只有一个参数，但在这个对象里包含了所需要的请求设置以及回调函数等信息，参数以key/value存在，所有参数是可选的。
待更：
load()
- 载入HTML文档
load方法是jQuery中最为简单和常用的Ajax方法，能载入远程HTML代码并插入DOM中。
load( url [,data] [,callback]);
- url：String类型，请求HTML页面的URL地址
- data：Object类型，发送至服务器的key/value数据
- callback：Function类型，请求完成时的回调函数，无论请求成功或失败。
首先构建一个被load()方法加载并追加到页面中的HTML文件。
test.html：
<div class="comment">
<h6>张三:</h6>
<p class="para">沙发</p>
</div>
<div class="comment">
<h6>李四:</h6>
<p class="para">板凳</p>
</div>
<div class="comment">
<h6>王五:</h6>
<p class="para">地板</p>
</div>
<input type="button" value="Ajax获取" id="send">
<div class="comment">已有评论:</div>
<div id="resText"></div>
另一个HTML：
$(function() {
$("#send").click(function() {
$("#resText").load("./test.html");
});
});
使用http-server运行，点击按钮后：
- 筛选载入的HTML文档
上面的例子是将test.html页面中的内容都加载到id为"resText"的元素里，如果只需要加载test.html页面内的某些元素，那么可以使用load()方法的URL参数来达到目的。通过URL参数指定选择符，就可以很方便的从加载过来的HTML文档里筛选出所需要的内容。
例如只需要加载test.html页面中的class为para的内容，可以：
$("#resText").load("./test.html .para");
- 传递方式
load()方法的传递方式根据参数data来自动指定。如果没有参数传递，则采用GET的方式传递；反之，则会自动转换为post方式。
// 无参数传递，则是GET方式
$("#resText").load("test.php",function() {
// ...
})
// 有参数传递，则是post方式
$("#resText").load("test.php",{name:"rain",age:"22"},function() {
// ...
})
- 回调函数
对于必须在加载之后才能继续的操作，load()方法提供了回调函数。
$("#resText").load("test.html",function(response,textStatus,XMLHttpRequest) {
// responseText：请求返回的内容
// textStatus：请求状态：success,error,notmodified,timeout4种
// XMLHttpRequest：XMLHttpRequest对象
})
在load方法中，无论ajax请求是否成功，只要当请求完成后（complete），回调函数就被触发。
$.get()和$.post()
load()方法通常用来从Web服务器上获取静态的数据文件，然而这并不能体现Ajax的全部价值。项目中，如果需要传递一些参数给服务器中的页面，那么可以使用$.get()或者$.post()方法。
$.get()和$.post()是jQuery中的全局函数。
1. $.get()方法
$.get()使用get方式来进行异步请求。
$.get( url [,data] [,callback] [,type]);
- url：string类型，请求的HTML页的URL地址
- data：Object，发送至服务器的key/value数据会作为queryString附加到请求URL中
- callback：function类型，载入成功时回调函数（只有当response的返回状态是success才调用该方法）自动将请求结果和状态传递给该方法。
- type：string类型，服务端返回内容的格式，包括XML、HTML、script、json、text和_default
<form action="#" id="form1">
<p>评论：</p>
<p>姓名：<input type="text" name="username" id="username"></p>
<p>内容：<textarea name="content" id="content" cols="20" rows="2"></textarea></p>
<p><input type="button" value="提交" id="send"></p>
</form>
<div class="comment">已有评论: </div>
<div id="resText"></div>
这是一个评论页面的HTML，通过它来演示$.get()方法。
将姓名和内容填写好后，就可以准备提交评论了。
（1）使用参数
首先，需要确定请求页面URL的地址。
$("#send").click(function() {
$.get( "get1.php" data参数 ,callback)
})
然后，在提交之前，需要获取姓名和内容的值作为data参数传递给后台。
$("#send").click(function() {
$.get("get1.php" , {
username : $("#username").val(),
content : $("#content").val()
} , 回调函数)
})
如果服务器接受到传递的data数据并成功返回，那么就可以通过回调函数将返回的数据显示到页面上。
$.get()方法的回调函数只有两个参数：
function(data,textStatus) {
// data : 返回的内容，XML、JSON、HTML片段等等
// textStatus : 请求状态：success,error,notmodified,timeout4种
}
（2）数据格式
服务器返回的数据格式可以有多种，他们都可以完成同样的任务，以下是几种返回格式的对比。
HTML片段
由于服务器端返回的数据格式是HTML片段，因此并不需要经过处理就可以将新的HTML数据插入到主页面中。
$(function() {
$("#send").click(function() {
$.get("get1.php" , {
username : $("#username").val(),
content : $("#content").val()
} , function(data,textStatus) {
$("#resText").html(data); // 将返回的数据添加到页面上
})
})
})
JSON文件
$(function() {
$("#send").click(function() {
$.get("get1.php" , {
username : $("#username").val(),
content : $("#content").val()
} , function(data,textStatus) {
var username = data.username;
var content = data.content;
var txtHTML = "<div class='comment'><h6>"
+ username + "</h6><p class='para'>"
+ content + "</p></div>";
$("#resText").html(txtHTML); // 将返回的数据添加到页面上
})
})
})
2. $.post()方法
- GET请求会将参数跟在URL后进行传递，而POST请求则是作为HTTP消息的实体内容发送给Web服务器。当然，在ajax请求中，这种区别对用户不可见。
- GET方式对传输的数据有大小限制（通常不能大于2KB）而是用post方式传递的数据量要比get方式大得多。（理论上不受限制）
- GET方式请求的数据会被浏览器缓存，因此其他人可以从浏览器历史纪录总读取到这些数据，例如账号和密码等，在某种情况下，get方式会造成严重的安全性问题，而post方式相对来说就可以避免这些问题。
- GET方式和POST方式传递的数据在服务器端的获取也不相同，在PHP中，get方式的数据可以用$_GET[]获取，而POST方式可以用$_POST[]获取。两种方式都可以用$_REQUEST[]来获取。
由于POST和GET方式提交的所有数据都可以通过$_REQUEST[]来获取，因此只需要改变jQuery函数，就可以将程序在GET请求和POST请求之间切换。
$(function() {
$("#send").click(function() {
$.post("post1.php" , {
username : $("#username").val(),
content : $("#content").val()
} , function(data,textStatus) {
$("#resText").append(data);
})
})
})
另外，当load()方法带有参数传递时，会使用POST方式发送请求。因此也可以使用load()完成同样功能。
$(function() {
$("#send").click(function() {
$("#resText").load("post1.php",{
username : $("#username").val(),
content : $("#content").val()
})
})
})
