一.jQuery 中封装的 AJAX
1.代码:
<script src="lib/jquery-1.12.4.js"></script>
<script>
$.ajax({
// 键:值
//请求方式
type:'GET',//默认是GET
//URL
url:'/query-get',
//发送给服务器的参数[可选]
data :'id=11&age=22&sex=33',
//处理服务器返回的数据
success:function(result){
//result 就是服务器返回的数据
console.log(result);
}
})
</script>
2.jQuery中$.ajax选项说明
设置 cache后
cache: 设置ie浏览器的缓存问题, cache: false 不缓存
url:请求地址
type / method:请求方法,默认为 get
dataType:预期服务端响应数据类型
不指定更好些
contentType:请求体内容类型,如果是POST请求,默认 application/x-www-form-urlencoded
data:需要传递到服务端的数据,如果 GET 则通过 URL 传递,如果 POST 则通过请求体传递
timeout:请求超时时间
beforeSend:请求发起之前触发
complete:请求完成触发(不管成功与否)
success:请求成功之后触发(响应状态码 200)
error:请求失败触发
二.jQuery中的get和post快捷方法
GET 请求快捷方法
$.get(url, [data]可选, [callback]可选, [dataType]可选)
$.get({settings}) //不推荐使用
POST 请求快捷方法
$.post(url, [data], [callback], [dataType])
$.post({settings})
GET请求快捷方法与POST请求快捷方法 用法相同
三.jQuery中的全局事件处理
每次Ajax请求都需要的事件,比如给一个请求响应过程进度提示,可以使用全局事件处理。反过来说,通过全局事件处理的事件,后续的每个ajax请求都会触发。
四.其他封装库axios
1.专门封装ajax的一个库
2.自己封装ajax
前面发送ajax请求的时候,总是要写大量重复的代码,用起来非常麻烦,为了简化ajax的使用,自己封装一个函数。