第110天 Ajax原生js封裝函式

1

//建立ajax物件
連線伺服器open(方法get/post，請求位址， 非同步傳輸)
xhr.open('get',  'data.txt',  true);

//

傳送請求
xhr.send();

1

//處理返回資料2/*
3** 每當readystate改變時，就會觸發onreadystatechange事件
4** readystate屬性儲存有xmlhttprequest的狀態資訊
5** 0 ：請求未初始化
6** 1 ：伺服器連線已建立
7** 2 ：請求已接受
8** 3 : 請求處理中
9** 4 ：請求已完成，且相應就緒
10*/
11 xhr.onreadystatechange= function
() else27}
28}29 }

1

function
ajax(type,url,data,success,failed) else910
var type =type.touppercase();
11//
用於清除快取
12var random =math.random();
1314
if(typeof
data== 'object')
19         data = str.replace(/&$/, '');20}
2122
if(type== 'get') else
28xhr.send();
2930     } else
if(type == 'post')
3637
//處理返回資料
38     xhr.onreadystatechange= function
() else46}
47}48}
49}5051
//測試呼叫
52var senddata = ;
53 ajax('get', 'data/data.html', senddata, function
(data), function
(error));

原生JS封裝AJAX

今天我們來說說利用原生js封裝ajax.jquery框架的ajax方法確實很好用,但有時候我們寫的頁面需要引入多個js外掛程式,不一定哪個外掛程式就會和jquery發生衝突,導致jquery用不了了.或者頁面比較簡單,不需要加重瀏覽器的負擔,這時我們自己封裝乙個ajax就是乙個很好的辦法.將資料轉換...

js 原生ajax 封裝函式

1 開啟伺服器wampserver 2 將檔案放置在wampserver的www資料夾下 3 開啟時網頁位址列為localhost www下的位址。eg http localhost myworld 5.19ajax index.html?hbt 1495158145298 4 呼叫方式 函式為 a...

原生js實現Ajax的封裝

1.封裝函式function ajax options options.type options.type get touppercase options.datatype options.datatype json options.async options.async true var para...