jQuery发送一个ajax请求
+ jQuery里面帮我们封装了几个方法
+ 专门用来发送ajax请求的
1 $.get() 专门用来发送get请求的
2 $.post() 专门用来发送post请求的
3 $.ajax() 发送什么请求都可以(get,post,put,delete)
==>并且还可以发送一个 jsonp 请求
jQuery发送一个GET请求
+ 语法:$.get(请求地址,需要携带到后端的参数,成功的回调函数,期望后端返回的数据类型)
==>请求地址: 你要请求的后端接口地址(必填)
==>携带参数: 你需要给后端传递的参数
==>可以是一个固定格式的字符串:"key1=val1&key1=val2"
==>可以是一个对象{key1:val1,key2:val2}
==>成功回调:当请求成功的时候会执行的函数
==>期望数据类型:就是你是不是需要jQuery帮你解析响应体
==>默认是不解析
==>当你传递一个'json'的时候,会自定帮你执行JSON.parse()
jQuery发送一个POST请求
+ 语法:$.post(请求地址,需要携带到后端的参数,成功的回调函数,期望后端返回的数据类型)
+ 四个参数和$.get是一模一样的
jQuery的$.ajax方法
+ 用来发送综合ajax请求的(GET,POST,PUT,DELETE)
+ 语法:$.ajax(对象)
==>对象是对本次请求的所有配置
==>$.ajax({
url:"", // 请求地址(必填)
type:"", // 请求方式(GET,POST,...),默认是GET,
method:"", // 同type
data:"", // 携带到后端的参数
dataType:"",// 期望后端返回的数据类型,默认不解析
async:true, // 是否异步,默认是true
success:function(){},//成功的回调
error:function(){}, //失败的回调
timeout:数字,// 单位是毫秒,超时时间(超过你写的时间没有响应,就算失败)
cache:true, // 是否缓存,默认是true
context:上下文,// 改变回调函数里面的this指向
......
})
$.ajax里面失败的回调
==>不光是请求失败的时候会触发
==>jQuery认定失败就是失败
==>dataType写成json的时候,jQuery会帮我们执行JSON.parse()
==>后端返回的不是一个json格式的字符串的时候
==>执行JSON.parse()就会报错
==>也会执行失败的回调,请求虽然成功,但是解析失败也是失败
==>JSON.parse("hello world")==>就会报错了
$.ajax里面是否缓存的问题
==>这个请求要不要缓存
==>当两次请求地址一样的时候,就会缓存
==>如果你把cache写成false,表示不需要缓存
==>jQuery就会自动在你的请求后面加一个参数_=时间戳
==>第一次请求:http://localhost/post.php?_=时间戳
==>第二次请求:http://localhost/post.php?_=时间戳
$.ajax里面的回调this指向的问题
==>ajax的回调里面默认this指向jQuery加工做的ajax对象
==>context的值你写的是谁,回调函数里面的this就是谁
$.ajax里面的请求方式的问题
==>$.ajax方法里面,type表示请求方式
==>jQuery还给了我们一个参数叫做method
==>也表示请求方式
==>当你写请求方式的时候
==>可以写成type:'POST'
==>也可以写成method:'POST'
$.ajax里面的接收响应的问题(2015年以后的版本才有Promise的形式)
==>jQuery默认把ajax封装成了promise的形式
==>你可以用success选项接收成功的回调
==>也可以用.then()的方式接收响应
jQuery发送一个GET请求
// 使用回调函数接收返回的结果
$.get('./get.php', { a: 1, b: 2 }, function (res) {
console.log(res)
}, 'json');
// 使用Promise接收返回的结果
$.get('./get.php',{message:'promise'}).then(function(res){
console.log(res)
})
// 使用await接收返回的结果
async function getData(){
var res = await $.get('./get.php',{message:'promise'});
console.log(res)
}
getData()
jQuery发送一个POST请求
$.post('./post.php', { cc: 1, dd: 2 }, function (res) {
console.log(res)
});
jQuery的$.ajax方法
$.ajax({
url: './post.php',
type: 'get',
success: function (res) {
console.log(res);
console.log(this)
},
error: function () {
console.log('失败的回调')
},
// dataType:'json'
// cache:false,
// context:{"message":"hello"}
})