ajax的介紹,實現過程 封裝函式

2021-09-29 00:26:59 字數 1624 閱讀 8839

js互動:

人機:行為,事件

資料:前後端,ajax

ajax:前後端互動的重要手段或橋梁

ajax不是乙個技術,一組技術的組合

ajax:a:非同步,j:js,a:和,x:服務端的資料

非同步的js和服務端的資料

特點:無重新整理載入頁面,破壞了歷史記錄,網路優化(seo)

ajax的組成:

非同步的js(事件)

其他js(處理解析資料)

xhr(xmlhttprequest)物件(前端後鏈結的載體)

資料(txt,html,json,xml)(必須都得是字元)符)

// 打**借錢

// 1.有手機

// 有xhr物件

// 2.撥號:對方的手機號,擴音/聽筒,同步/非同步

// 設定要請求的方式和位址

// 3.等待監聽狀態,是否接通的狀態

// 監聽事件

xhr.onreadystatechange = function()

// else

}// 4.說話

// 傳送

xhr.send();

function ajaxget(url,cb,data)=$&;

}// 「user=admin&pass=123」;

// console.log(str.slice(0,str.length-1));

// 2.拼接url

url = url + 「?」 + str;

// 3.準備ajax的過程

xhr.open("get",url,true);

xhr.onreadystatechange = function()

}xhr.send();

}

// get和post的不同:

function ajaxpost(url,callback,data);

var str = 「」;

for(var i in data)=$&;

}var d = new date();

// 2-1.傳送資料的位置,不再是url

// 1.open的引數

xhr.open("post",url,true);

xhr.onreadystatechange = function()

}// 3.send會原模原樣的傳送自己接受的資料,所以需要在傳送之前設定傳送資料的格式:表單格式

// 2-2.而是send

xhr.send(str);

}

Ajax函式的封裝

封裝乙個ajax 函式,每次呼叫ajax函式的時候只需要傳遞乙個物件,物件中包含請求型別 請求位址 要傳遞的引數 content type等等 當沒有傳遞某些引數的時候,將使用某些預設值 函式中自定義默寫預設值 具體的函式封裝如下 function ajax obj contenttype succ...

封裝ajax函式

function ajax options header success function error function 使用options物件中的屬性覆蓋defaults物件中的屬性,object.assign defaults,options 建立ajax物件 拼接請求引數的變數 var par...

Ajax函式封裝

備份 function ajax options header success function error function 使用options中的屬性覆蓋defaults物件中的屬性 object.assign defaults,options 建立ajax物件 拼接請求引數的變數 var pa...