都知道實(shí)現(xiàn)頁(yè)面的異步操作需要使用Ajax,那么Ajax到是怎么實(shí)現(xiàn)異步操作的呢?
首先需要認(rèn)識(shí)一個(gè)對(duì)象 --> XMLHttpRequest 對(duì)象 --> Ajax的核心。它有許多的屬性和方法事件以便于腳本處理和控制HTTP的請(qǐng)求和響應(yīng)。
下面來認(rèn)識(shí)幾個(gè)屬性:我不用官方的話來解釋,希望大家能一看就知道是什么意思
readyState 屬性
創(chuàng)建XMLHttpRequest對(duì)象(下面稱ajax對(duì)象)后,readyState屬性則表示當(dāng)前對(duì)象處于一個(gè)什么狀態(tài) ,一共5個(gè)狀態(tài)
0 未初始化狀態(tài) ,ajax對(duì)象已經(jīng)創(chuàng)建
1 準(zhǔn)備發(fā)送狀態(tài),調(diào)用了open()方法,并且已經(jīng)準(zhǔn)備好將一個(gè)請(qǐng)求發(fā)送到服務(wù)器
2 已發(fā)送狀態(tài), 已經(jīng)通過send()方法把一個(gè)請(qǐng)求發(fā)送到服務(wù)器,但是沒有收到一個(gè)響應(yīng)
3 正在接受狀態(tài),已經(jīng)接收到HTTP的響應(yīng)頭部信息,但是消息體還沒有還沒有完全接收
4 完成響應(yīng)狀態(tài),已經(jīng)完成HttpResponse的響應(yīng)接收
status 屬性:
描述了HTTP狀態(tài)代碼,當(dāng)readyState值小于3時(shí) 不可讀取,會(huì)引發(fā)異常錯(cuò)誤
下面是Ajax的封裝代碼,我們來逐步分析,以便于理解
View Code
1 .一個(gè)json2Url格式的方法
調(diào)用ajax()時(shí)里面是以json的形式傳數(shù)據(jù),但是我們的url是這樣的
https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=&json=1&p=3&sid=1464_21105_18560_17001_;
所以我們需要把格式轉(zhuǎn)換這樣才能提交,由于ie存在緩存所以需要加一個(gè)隨機(jī)數(shù),encodeURICompon