封裝ajax函數（不可跨域）

1、主體：封裝ajax函數：ajaxFunc

function ajaxFunc(method, url, data, callback, flag) {
//(1)建立ajax對象
var xhr;
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
} else {
xhr = new ActiveXObject('Microsoft.XMLHttp');
}
//(2)請求方式get||post
method = method.toUpperCase();
if(method == 'GET'){
xhr.open(method, url, flag);
xhr.send();
}else if(method == 'POST'){
xhr.open(method, url, flag);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.send(data);
}
//(3)監聽請求數據
xhr.onreadystatechange = function(){
if(xhr.readyState == 4){
if(xhr.status == 200){
callback(xhr.responseText);
}
xhr = null;
}
}
}
//(4)回調函數對數據處理
function callback(requestData){
var obj = JSON.parse(requestData);
}

 

2、次要

1.ajax全稱：asynchronous JavaScript and xml

2.ajax特色：局部獲取數據，且不用刷新頁面（好比地圖）；受同源策略的限制，只能獲取同源的資源，除非不一樣源的服務器某資源的內部進行配置，容許該頁面訪問。

3.請求方式：get、post、put、delete；

4.get、post的區別：

（1）提交方式：

get：請求的數據在URL以後，用？分隔URL和數據，用&鏈接多個參數，數據是英文或數字會原樣發送，若是是空格轉換爲+，如

果是中文或其餘字符用base64加密，獲得16進制的ASCII碼值；

post：把提交的數據放在HTTP的包體中

（2）傳輸數據大小：

首先，HTTP協議沒有對傳輸數據大小進行限制，也沒有對URL長度進行限制，可是不一樣的瀏覽器和服務器對URL的長度進行了限制（大約都在2K多一點的字節），所以

get的數據請求受到了限制

post雖然不受URL的限制，可是各個服務器會規定對post提交的數據大小進行限制，不過post請求的數據要比get大

（3）安全性：

因爲數據提交方式的不一樣，get請求要更加不安全

（4）post不支持複雜數據類型，由於post沒有定義傳輸數據結構的語義和規則；soap是http post的一個專用版本，遵循一種特殊的xml格式，Content-type設置爲

text/xml，任何數據均可以xml化。

5.ajax的請求過程：

6.readystatechange事件——監聽資源加載狀態

支持該事件（readystatechange）的每個對象都有一個readyState屬性

該屬性（readyState）包括5個狀態值：

0：未初始化

1：調用了send方法，正在請求資源

2：請求資源完成

3：交互中，解析響應的內容

4：完成

不是全部的對象都會經歷readyState屬性的每個狀態值的變化，有的對象會直接跳過某些狀態

7.服務器響應的狀態碼：

200：成功請求資源

300：請求的資源位置發生變化

400：服務器拒絕、找不到、不容許 該URL的請求

500：服務器內部問題