ajax：在不切換頁(yè)面的情況下完成異步的HTTP請(qǐng)求
(1)創(chuàng)建XMLHttpRequest對(duì)象,也就是創(chuàng)建一個(gè)異步調(diào)用對(duì)象.
(2)創(chuàng)建一個(gè)新的HTTP請(qǐng)求,并指定該HTTP請(qǐng)求的方法、URL及驗(yàn)證信息.
(3)設(shè)置響應(yīng)HTTP請(qǐng)求狀態(tài)變化的函數(shù).
(4)發(fā)送HTTP請(qǐng)求.
(5)獲取異步調(diào)用返回的數(shù)據(jù).
(6)使用JavaScript和DOM實(shí)現(xiàn)局部刷新.
1
2
3
4
5
6
7
8
9
10
11
12
13
var xmlHttp = new XMLHttpRequest();
xmlHttp.open('GET','demo.php','true');
xmlHttp.send()
xmlHttp.onreadystatechange = function(){
if(xmlHttp.readyState === 4 & xmlHttp.status === 200){
}
}
使用promise封裝
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
function getJSON(url) {
return new Promise(function(resolve, reject) {
var XHR = new XMLHttpRequest();
XHR.open('GET', url, true);
XHR.send();
XHR.onreadystatechange = function() {
if (XHR.readyState == 4) {
if (XHR.status == 200) {
try {
var response = JSON.parse(XHR.responseText);
resolve(response);
} catch (e) {
reject(e);
}
} else {
reject(new Error(XHR.statusText));
}
}
}
})
}
getJSON(url).then(res => console.log(res));
當(dāng)前狀態(tài)readystate
0 代表未初始化刁赖。 還沒(méi)有調(diào)用 open 方法
1 代表正在加載逛钻。 open 方法已被調(diào)用，但 send 方法還沒(méi)有被調(diào)用
2 代表已加載完畢雨女。send 已被調(diào)用谚攒。請(qǐng)求已經(jīng)開(kāi)始
3 代表交互中。服務(wù)器正在發(fā)送響應(yīng)
4 代表完成氛堕。響應(yīng)發(fā)送完畢
常用狀態(tài)碼status
404 沒(méi)找到頁(yè)面(not found)
403 禁止訪問(wèn)(forbidden)
500 內(nèi)部服務(wù)器出錯(cuò)(internal service error)
200 一切正常(ok)
304 沒(méi)有被修改(not modified)(服務(wù)器返回304狀態(tài)馏臭，表示源文件沒(méi)有被修改）
