手動封裝AJAX

2022-03-31 02:12:54 字數 1800 閱讀 9361

呼叫順序:

呼叫f3函式,輸出2次33333,然後呼叫f2函式,輸出2次22222,呼叫f1函式,輸出5次1111111;

f1的**執行完成後會回到被呼叫的位置接著執行**,此時輸出3次222222,然後回到f2被呼叫的位置,輸出3次333

呼叫順序:

呼叫getresult時傳入3個引數,第3個是乙個匿名函式,函式裡面計算ab的和,getresult接受到120,230引數分別賦值給n1和n2,然後呼叫fn函式進行計算值,返回結果給result,返回result給res接收,最後控制台輸出res就得到350了。

目錄結構:

1.建立非同步物件

2. 設定請求行

3. 設定請求頭

4. 設定請求體

5. 設定監視非同步物件狀態

*///

這種方式不好,引數固定死了,不靈活,順序只能這樣

//ajax是乙個函式,如果引入到別的檔案當中,有可能會靠變數或函式的汙染

/*function ajax(params)

}} */var $ =

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

return str.slice(0,-1);

},//

**沒問題

//建立乙個名為ajax方法,進行使用非同步物件傳送請求

ajax: function(params) ); //

獲取要傳送的資料

var success =params.success;

var datatype = params.datatype || 'text/plain'; //

什麼都沒有就以純字串

//建立非同步ajax物件

//設定請求行

xhr.open(type, url);

//設定請求頭

if(type=='post')

//get請求可以省略這一步

//設定請求體

xhr.send(data); //

這裡的data就是通過converttostring方法拼接的字串

//監聽非同步物件狀態

xhr.onreadystatechange = function

() else

if(datatype=='xml')

else

success(res);}}

}}studentsjson.html

id姓名

性別年齡

專業位址

1小蘇男

18前端

佛山

studentsxml.html

id姓名

性別年齡

專業位址

1小蘇男

18前端

佛山

如果不想手動封裝ajax,可以使用jquery,直接引入jq檔案,其他不需要改,直接$.ajax()就可以了。

備忘 原生js進行簡單的ajax手動封裝

function ajax payload 建立xhr物件 通過open方法配置請求資訊,第乙個引數是請求方式,第二個引數是請求的url,第三個引數是請求是否非同步 true非同步 xhr.open payload.url,payload.method,true 傳送請求 xhr.send 乙個最基...

手動封裝on,emit,off

on 繫結 emit 觸發 off 解綁 存放事件 eventlist 1對多on eventname,callback handle n多個 1 判斷事件名稱是否存在 2 如果存在的情況下將cb存放在eventname這個陣列當中 3 如果不存在建立key值為eventname val值為陣列 1...

手動封裝XMLHttpRequest

自己動手封裝乙個xmlhttprequest,相容低版本瀏覽器,自動檢測post與get 型別請求,自動引數拼接,引數型別辨別 charset utf 8 自定義xmlhttprequest實現前後端通訊title head type button onclick getdata 獲取資料butto...