2019-07-11-Ajax

Ajax:在不刷新頁(yè)面的情況下,異步的服務(wù)器進(jìn)行交互;

示例:

function getAjax(httpUrl,fn){

????????//1實(shí)例化xhr對(duì)象

????????var xhr = new XMLHttpRequest()

????????//2設(shè)置請(qǐng)求的路徑和方法

????????xhr.open("GET",httpUrl);

????????//3發(fā)送請(qǐng)求

????????xhr.send()

????????//4監(jiān)聽(tīng)事件,接收請(qǐng)求

????????xhr.onreadystatechange = function(){

????????????????if(xhr.readyState==4&&xhr.status==200){

????????????????/*console.log(xhr.readyState);

????????????????console.log(xhr.status)

????????????????console.log(xhr)*/

????????????????fn(xhr)

????????????????}

????????}

}

getAjax("http://127.0.0.1:8020/5-1ajax/hello.txt",function(xhr){

????????var h1 = document.createElement("h1");

????????h1.innerHTML = xhr.responseText;

????????h1.style.color = "pink"

????????document.body.appendChild(h1)

})

?著作權(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)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

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

  • "use strict";function _classCallCheck(e,t){if(!(e instanc...
    久些閱讀 2,142評(píng)論 0 2
  • 單例模式 適用場(chǎng)景:可能會(huì)在場(chǎng)景中使用到對(duì)象,但只有一個(gè)實(shí)例,加載時(shí)并不主動(dòng)創(chuàng)建,需要時(shí)才創(chuàng)建 最常見(jiàn)的單例模式,...
    Obeing閱讀 2,314評(píng)論 1 10
  • HTML HTML5標(biāo)簽 媒體查詢head部分寫法 Doctype作用? 嚴(yán)格模式與混雜模式如何區(qū)分?它們有何意義...
    Mayo_閱讀 715評(píng)論 0 8
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML標(biāo)準(zhǔn)。 注意:講述HT...
    kismetajun閱讀 28,803評(píng)論 1 45
  • AJAX 原生js操作ajax 1.創(chuàng)建XMLHttpRequest對(duì)象 var xhr = new XMLHtt...
    碧玉含香閱讀 3,558評(píng)論 0 7

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