jQuery的Ajax API是对XMLHttpRequest对象的抽象,解决了浏览器之间的兼容性问题,同时提供了一些方便的方法。这篇博客的撰写参考了jQuery官网,jQuery Ajax API
关于XMLHttpRequest对象请参照我的另一篇博客:XMLHttpRequest进行异步请求(包括文件上传)详解
核心概念
GET or POST
- GET用于从服务器获取数据
- POST用于向服务器提交数据
数据类型
jQuery需要一些指令作为你的Ajax请求期望返回的数据类型,可以通过方法来指定,例如$.getJSON(),还可以通过选项对象来指定。
下面是数据类型:
类型 | 描述 |
---|---|
text | 字符串 |
html | 传输被替换到页面中的一块HTML代码 |
script | 新增一个script到页面中 |
json | 串json编码的数据,可以是数组,字符串,对象 |
jsonp | 跨域请求json数据 |
xml | xml格式的数据 |
请求是异步的
因为jQuery的Ajax请求默认是异步的(可以通过配置选项属性async:false来变成同步的),所以响应只能在回调函数中被处理。
同源策略和JSONP
通常Ajax请求只能限制请求相同协议、相同端口、以及相同的域名下的资源。但是这个限制在使用jQuery加载script标签时不会起作用。
JSONP使用一个script标签来执行跨域请求,因为script标签的请求不受同源策略的限制。script中会携带我请求的数据,并将其包裹在我指定的回调函数中。
jQuery的Ajax相关的方法
最核心的方法是$.ajax()。
$.ajax()
$.ajax()方法是一个有力并且直接的创建Ajax请求的方法。使用一个选项对象作为参数传给它,这个选项对象的属性配置了完成请求所需要的所有指令。
$.ajax()提供了成功以及失败的回调函数。
实例代码如下:
$.ajax({
url: "post.php",
type: "post",
data: {
// 传输的数据,如果是get请求将会被转为URL中的请求参数
id:1
},
dataT