jQuery發(fā)送一個(gè)ajax請(qǐng)求

????????????????+?jQuery里面幫我們封裝了幾個(gè)方法

????????????????+?專(zhuān)門(mén)用來(lái)發(fā)送ajax請(qǐng)求的

????????????????????????1?$.get()?專(zhuān)門(mén)用來(lái)發(fā)送get請(qǐng)求的

????????????????????????2?$.post()?專(zhuān)門(mén)用來(lái)發(fā)送post請(qǐng)求的

????????????????????????3?$.ajax()??發(fā)送什么請(qǐng)求都可以(get,post,put,delete)

????????????????????????????????????==>并且還可以發(fā)送一個(gè)?jsonp?請(qǐng)求

????????????jQuery發(fā)送一個(gè)GET請(qǐng)求

????????????????????????+?語(yǔ)法:$.get(請(qǐng)求地址,需要攜帶到后端的參數(shù),成功的回調(diào)函數(shù),期望后端返回的數(shù)據(jù)類(lèi)型)

????????????????????????????????==>請(qǐng)求地址:?你要請(qǐng)求的后端接口地址(必填)

????????????????????????????????==>攜帶參數(shù):?你需要給后端傳遞的參數(shù)

????????????????????????????????????????????==>可以是一個(gè)固定格式的字符串:"key1=val1&key1=val2"

????????????????????????????????????????????==>可以是一個(gè)對(duì)象{key1:val1,key2:val2}

????????????????????????????????==>成功回調(diào):當(dāng)請(qǐng)求成功的時(shí)候會(huì)執(zhí)行的函數(shù)

????????????????????????????????==>期望數(shù)據(jù)類(lèi)型:就是你是不是需要jQuery幫你解析響應(yīng)體

????????????????????????????????????????==>默認(rèn)是不解析

????????????????????????????????????????==>當(dāng)你傳遞一個(gè)'json'的時(shí)候,會(huì)自定幫你執(zhí)行JSON.parse()

????????????jQuery發(fā)送一個(gè)POST請(qǐng)求

????????????????????????+?語(yǔ)法:$.post(請(qǐng)求地址,需要攜帶到后端的參數(shù),成功的回調(diào)函數(shù),期望后端返回的數(shù)據(jù)類(lèi)型)

????????????????????????+?四個(gè)參數(shù)和$.get是一模一樣的

????????????jQuery的$.ajax方法

????????????????????+?用來(lái)發(fā)送綜合ajax請(qǐng)求的(GET,POST,PUT,DELETE)

????????????????????+?語(yǔ)法:$.ajax(對(duì)象)

????????????????????????????==>對(duì)象是對(duì)本次請(qǐng)求的所有配置

????????????????????????????==>$.ajax({

????????????????????????????????????url:"",?????//?請(qǐng)求地址(必填)

????????????????????????????????????type:"",????//?請(qǐng)求方式(GET,POST,...),默認(rèn)是GET,

????????????????????????????????????method:"",??//?同type

????????????????????????????????????data:"",????//?攜帶到后端的參數(shù)

????????????????????????????????????dataType:"",//?期望后端返回的數(shù)據(jù)類(lèi)型,默認(rèn)不解析

????????????????????????????????????async:true,?//?是否異步,默認(rèn)是true

????????????????????????????????????success:function(){},//成功的回調(diào)

????????????????????????????????????error:function(){},??//失敗的回調(diào)

????????????????????????????????????timeout:數(shù)字,//?單位是毫秒,超時(shí)時(shí)間(超過(guò)你寫(xiě)的時(shí)間沒(méi)有響應(yīng),就算失敗)

????????????????????????????????????cache:true,??//?是否緩存,默認(rèn)是true

????????????????????????????????????context:上下文,//?改變回調(diào)函數(shù)里面的this指向

????????????????????????????????????????......

????????????????????????????})

????????????$.ajax里面失敗的回調(diào)

????????????????==>不光是請(qǐng)求失敗的時(shí)候會(huì)觸發(fā)

????????????????==>jQuery認(rèn)定失敗就是失敗

????????????????????==>dataType寫(xiě)成json的時(shí)候,jQuery會(huì)幫我們執(zhí)行JSON.parse()

????????????????????==>后端返回的不是一個(gè)json格式的字符串的時(shí)候

????????????????????==>執(zhí)行JSON.parse()就會(huì)報(bào)錯(cuò)

????????????????????==>也會(huì)執(zhí)行失敗的回調(diào),請(qǐng)求雖然成功,但是解析失敗也是失敗

????????????????????==>JSON.parse("hello?world")==>就會(huì)報(bào)錯(cuò)了

????????????$.ajax里面是否緩存的問(wèn)題

????????????????==>這個(gè)請(qǐng)求要不要緩存

????????????????==>當(dāng)兩次請(qǐng)求地址一樣的時(shí)候,就會(huì)緩存

????????????????==>如果你把cache寫(xiě)成false,表示不需要緩存

????????????????==>jQuery就會(huì)自動(dòng)在你的請(qǐng)求后面加一個(gè)參數(shù)_=時(shí)間戳

????????????????????==>第一次請(qǐng)求:http://localhost/post.php?_=時(shí)間戳

????????????????????==>第二次請(qǐng)求:http://localhost/post.php?_=時(shí)間戳

????????????$.ajax里面的回調(diào)this指向的問(wèn)題

????????????????==>ajax的回調(diào)里面默認(rèn)this指向jQuery加工做的ajax對(duì)象

????????????????==>context的值你寫(xiě)的是誰(shuí),回調(diào)函數(shù)里面的this就是誰(shuí)

????????????$.ajax里面的請(qǐng)求方式的問(wèn)題

????????????????==>$.ajax方法里面,type表示請(qǐng)求方式

????????????????==>jQuery還給了我們一個(gè)參數(shù)叫做method

????????????????==>也表示請(qǐng)求方式

????????????????????==>當(dāng)你寫(xiě)請(qǐng)求方式的時(shí)候

????????????????????==>可以寫(xiě)成type:'POST'

????????????????????==>也可以寫(xiě)成method:'POST'

????????????$.ajax里面的接收響應(yīng)的問(wèn)題(2015年以后的版本才有Promise的形式)

????????????????==>jQuery默認(rèn)把a(bǔ)jax封裝成了promise的形式

????????????????==>你可以用success選項(xiàng)接收成功的回調(diào)

????????????????==>也可以用.then()的方式接收響應(yīng)

?jQuery發(fā)送一個(gè)GET請(qǐng)求

????????//?使用回調(diào)函數(shù)接收返回的結(jié)果

????????$.get('./get.php',?{?a:?1,?b:?2?},?function?(res)?{

????????????console.log(res)

????????},?'json');

????????//?使用Promise接收返回的結(jié)果

? ? ? ? ?$.get('./get.php',{message:'promise'}).then(function(res){

? ? ? ? ? ? ?console.log(res)

? ? ? ? ?})

????????//?使用await接收返回的結(jié)果

? ? ? ? ?async?function?getData(){

? ? ? ? ? ? ?var?res?=?await?$.get('./get.php',{message:'promise'});

? ? ? ? ? ? ?console.log(res)

? ? ? ? ?}

? ? ? ? ?getData()

?jQuery發(fā)送一個(gè)POST請(qǐng)求

????????$.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('失敗的回調(diào)')

????????????},

????????????//?dataType:'json'

????????????//?cache:false,

????????????//?context:{"message":"hello"}

????????})