Ajax方法封裝

標籤：ade   cat   引用   get   資料   text   發送請求   change   arp   

打算自己封裝一個ajax方法，再不用jq庫的情況下，直接引用：

ajax作用：資料互動，在不重新整理頁面的情況下，發送請求，擷取資料；

首頁第一步常見一個ajax對象：XMLHttpRequest,之後會用這個對象的屬性和方法完成一個資料互動的過程；

1.open方法：

參數：開啟檔案（post和get）、地址、是否非同步（非同步：非阻塞，前面的代碼不會影響後面代碼的執行；同步：阻塞，前面的代碼會影響後面代碼的執行）

2、send方法

發送請求

3、onReadyStateChange事件：當狀態值readystate改變的時候觸發的事件

readystate:ajax工作狀態：0代表還沒有調用open方法；1代表已經調用send方法，正在發送請求；2代表發送請求已完成，已經收到相應內容；；3收到內容解析；4代表內容可在用戶端調用

4、status伺服器狀態代碼

備忘：post和get區別：get是通過url傳輸，post是通過瀏覽器傳輸，ajax封裝代碼如下

function ajax(method, url, data, success) {var xhr = null;try {xhr = new XMLHttpRequest();} catch (e) {xhr = new ActiveXObject(‘Microsoft.XMLHTTP‘);}if (method == ‘get‘ && data) {url += ‘?‘ + data;}xhr.open(method,url,true);if (method == ‘get‘) {xhr.send();} else {xhr.setRequestHeader(‘content-type‘, ‘application/x-www-form-urlencoded‘);xhr.send(data);}xhr.onreadystatechange = function() {if ( xhr.readyState == 4 ) {if ( xhr.status == 200 ) {success && success(xhr.responseText);} else {alert(‘出錯了,Err：‘ + xhr.status);}}}}

　　

Ajax方法封裝