原生JS實(shí)現(xiàn)Ajax

// 第一步: 獲得XMLHttpRequest對(duì)象
            var ajax = new XMLHttpRequest();
            // 第二步: 設(shè)置狀態(tài)監(jiān)聽(tīng)函數(shù)
            ajax.onreadystatechange = function(){
                console.log(ajax.readyState);
                console.log(ajax.status);
                // 第五步:在監(jiān)聽(tīng)函數(shù)中,判斷readyState=4 && status=200表示請(qǐng)求成功
                if(ajax.readyState==4 && ajax.status==200){
                    // 第六步: 使用responseText、responseXML接受響應(yīng)數(shù)據(jù),并使用原生JS操作DOM進(jìn)行顯示
                    console.log(ajax.responseText);
                    console.log(ajax.responseXML);// 返回不是XML,顯示null
                    console.log(JSON.parse(ajax.responseText));
                    console.log(eval("("+ajax.responseText+")"));
                }
            }
            // 第三步: open一個(gè)鏈接
            ajax.open("GET","h51701.json",false);//true異步請(qǐng)求,false同步
            
            // 第四步: send一個(gè)請(qǐng)求。 可以發(fā)送對(duì)象和字符串,不需要傳遞數(shù)據(jù)發(fā)送null
            ajax.send(null);
注釋?zhuān)?
1. open(method, url, async) 方法需要三個(gè)參數(shù):

  method:發(fā)送請(qǐng)求所使用的方法(GET或POST);與POST相比,GET更簡(jiǎn)單也更快,并且在大部分情況下都能用;然而,在以下情況中,請(qǐng)使用POST請(qǐng)求:

無(wú)法使用緩存文件(更新服務(wù)器上的文件或數(shù)據(jù)庫(kù))
向服務(wù)器發(fā)送大量數(shù)據(jù)(POST 沒(méi)有數(shù)據(jù)量限制)
發(fā)送包含未知字符的用戶(hù)輸入時(shí),POST 比 GET 更穩(wěn)定也更可靠
 url:規(guī)定服務(wù)器端腳本的 URL(該文件可以是任何類(lèi)型的文件,比如 .txt 和 .xml,或者服務(wù)器腳本文件,比如 .asp 和 .php (在傳回響應(yīng)之前,能夠在服務(wù)器上執(zhí)行任務(wù)));

 async:規(guī)定應(yīng)當(dāng)對(duì)請(qǐng)求進(jìn)行異步(true)或同步(false)處理;true是在等待服務(wù)器響應(yīng)時(shí)執(zhí)行其他腳本,當(dāng)響應(yīng)就緒后對(duì)響應(yīng)進(jìn)行處理;false是等待服務(wù)器響應(yīng)再執(zhí)行。

2. send() 方法可將請(qǐng)求送往服務(wù)器。

3. onreadystatechange:存有處理服務(wù)器響應(yīng)的函數(shù),每當(dāng) readyState 改變時(shí),onreadystatechange 函數(shù)就會(huì)被執(zhí)行。

4. readyState:存有服務(wù)器響應(yīng)的狀態(tài)信息。

0: 請(qǐng)求未初始化
1: 服務(wù)器連接已建立
2: 請(qǐng)求已接收
3: 請(qǐng)求處理中
4: 請(qǐng)求已完成,且響應(yīng)已就緒
5. responseText:獲得字符串形式的響應(yīng)數(shù)據(jù)。
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容