一、jQuery中的ajax
-
封裝第一層 - 類似于原生ajax的用法
$ajax
-
封裝第二層 - 基于第一層再次封裝
$().load();
$.post();
$.get(); -
封裝的第三層 - 特殊用法
$.getScript(); - 動(dòng)態(tài)讀取腳本(js代碼)
$.getJson(); - 接收json格式數(shù)據(jù)
二、load(url,data,callback)方法
1. 最簡(jiǎn)單、局限性最大
url - 設(shè)置ajax的請(qǐng)求地址
data - 設(shè)置ajax的請(qǐng)求數(shù)據(jù)
要求為key:value格式,其實(shí)就是js的對(duì)象格式
callback: ajax請(qǐng)求成功后的回調(diào)函數(shù)
回調(diào)函數(shù)的參數(shù)就是服務(wù)器返回的數(shù)據(jù)
2. 服務(wù)器響應(yīng)的數(shù)據(jù)自動(dòng)寫入調(diào)用load方法的屬性中
3. load()方法的請(qǐng)求類型
1)沒(méi)有請(qǐng)求數(shù)據(jù)時(shí),請(qǐng)求類型是GET
2) 發(fā)送請(qǐng)求數(shù)據(jù)時(shí),請(qǐng)求類型是POST
4. load()方法接受服務(wù)器端的響應(yīng)數(shù)據(jù)
是以字符串類型(HTML格式)來(lái)接受
三、get/post()方法
1. get(url,data,callback,type)
1. 參數(shù)
url - 設(shè)置ajax的請(qǐng)求地址
data - 設(shè)置ajax的請(qǐng)求數(shù)據(jù)
要求為key:value格式,其實(shí)就是js的對(duì)象格式
callback: ajax請(qǐng)求成功后的回調(diào)函數(shù)
回調(diào)函數(shù)的參數(shù)就是服務(wù)器返回的數(shù)據(jù)
type:設(shè)置服務(wù)器端響應(yīng)的數(shù)據(jù)格式
默認(rèn)值為HTML,還可以為xml/json
2. 無(wú)論是否發(fā)送請(qǐng)求數(shù)據(jù),請(qǐng)求類型都是GET
3. $.get()方法可以接受HTML/XML/JSON格式
2. post(url,data,callback,type)
使用方式跟get一模一樣
四、$.ajax(options)方法
options的格式是{key:value}
url:請(qǐng)求地址
type:請(qǐng)求類型,默認(rèn)為get
async:是否異步,默認(rèn)為true
-
contentType POST方式發(fā)送數(shù)據(jù)的前提
默認(rèn)值為application/x-www-form-urlencoded
data:請(qǐng)求數(shù)據(jù),格式必須為key=value
-
success:請(qǐng)求成功后的回調(diào)函數(shù)
function(data,textStatus)
data - 服務(wù)器響應(yīng)的內(nèi)容
textStatus - 表示ajax請(qǐng)求的狀態(tài),此時(shí)的值為success
-
error:請(qǐng)求失敗后的回調(diào)函數(shù)
function(XMLHttpRequest,textStatus,errorThrown)
XMLHttpRequest - ajax的核心對(duì)象
errorThrown - 錯(cuò)誤異常信息
textStatus - 表示ajax請(qǐng)求的狀態(tài)
error/timeout/notmodified
-
dataType:數(shù)據(jù)響應(yīng)格式
HTML/XML/JSON
五、使用$.getScript(url,calback)動(dòng)態(tài)讀取腳本
若JS代碼過(guò)多時(shí),會(huì)影響HTML頁(yè)面加載的速度,如果已被加載的JS代碼并不是立即執(zhí)行,只加載馬上執(zhí)行的js代碼,會(huì)提交效率
-
參數(shù)
url - 讀取腳本的地址(本地或服務(wù)器)
calback - 回調(diào)函數(shù)