1 <script>
2 // 封裝通用的xhr對象，兼容各個版本
3 function creatXHR() {
4 // 判斷瀏覽器是否將XMLHttpRequest作為本地對象實現(xiàn)，針對IE7,firefox, opera等
5 if (typeof XMLHttpRequest != "undefined") {
6 return new XMLHttpRequest();
7 }
8 else if (typeof ActiveXObject != "undefined") {
9 // 將所有可能出現(xiàn)的ActiveXObject版本放在一個數(shù)組中
10 var xhrArr = [
11 'Microsoft.XMLHTTP',
12 'MSXML2.XMLHTTP.6.0',
13 'MSXML2.XMLHTTP.5.0',
14 'MSXML2.XMLHTTP.4.0',
15 'MSXML2.XMLHTTP.3.0',
16 'MSXML2.XMLHTTP.2.0'
17 ];
18 // 遍歷創(chuàng)建XMLHttpRequest對象
19 var xhr;
20 for (let i = 0; i < array.length; i++) {
21 try {
22 // 創(chuàng)建XMLHrrpRequest對象
23 xhr = new ActiveXObject(xhrArr[i]);
24 break;
25 } catch (error) {
26
27 }
28
29 }
30 return xhr;
31 }
32 else{
33 throw new Error('不支持XMLHttpRequest對象');
34 }
35 }
36 // 創(chuàng)建xhr
37 var xhr = creatXHR();
38 // 存儲獲取到的數(shù)據(jù)
39 var data;
40
41 // 響應(yīng)XMLHttpRequest對象狀態(tài)變化的函數(shù)，onreadystatechange在readyState屬性發(fā)生改變時觸發(fā)
42 xhr.onreadystatechange = function (/* callback */) {
43 // 異步調(diào)用成功，響應(yīng)內(nèi)容解析完成，可以在客戶端調(diào)用
44 if (xhr.readyState == 4) {
45 // 200 OK，304 讀取緩存
46 if ((xhr.status >= 200 && xhr.status < 300) || xhr.status === 304) {
47 // 獲取服務(wù)器返回的數(shù)據(jù)
48 // 數(shù)據(jù)以字符串類型存放在 xhr.responseText
49 // json序列化解析xhr.responseText
50 // 將ajax獲取到的數(shù)據(jù)傳遞出去
51 data = JSON.parse(xhr.responseText);
52 // 或者在參數(shù)中傳入callback，在此處執(zhí)行回調(diào)函數(shù)
53 // callback && callback();
54 }
55 }
56 };
57
58
59 // 創(chuàng)建請求，這里只是創(chuàng)建，并不發(fā)送
60 xhr.open("get", "./xxx.json", true);
61
62 // 發(fā)送請求
63 xhr.send(null);
64
65 /* 使用post方法，傳參方式
66 // 創(chuàng)建請求，這里只是創(chuàng)建，并不發(fā)送
67 xhr.open("post", "./xxx.json", true);
68 // 設(shè)置http頭部信息
69 xhr.setRequestHeader("Content-type", "application/x-www-form-urlcoded");
70 xhr.send({param1:'strrr', param2:789});
71 */
72 </script>
