封裝源生ajax代碼:
var data = {type: "get",url:"",data:null,async:true,success:null,error:null};
function ajax(data){
// 第一步:創建XMLHttpRequest對象
var xhr = null;
if(window.XMLHttpRequest){ // 標準瀏覽器
xhr = new XMLHttpRequest();
}
else{ // 早期的IE瀏覽器
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
// 定義一些參數
var type = data.type == "get" ? "get" : "post";
var async = data.type ? true : false;
// 第二步:準備發送請求,配置發送請求的一些行爲
xhr.open(type,data.url,async);
// 第三步:執行發送的動作,如果是post,要設置請求頭
if(type === "post"){
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
}
xhr.send(data.data);
// 第四步:指定一些回調函數
xhr.onreadystatechange = function(){
// xhr.readyState返回值:0 XMLHttpRequest 對象創建完成
// 1 初始化完成open,表示發送請求的動作準備好了,但是還沒有開始發送
// 2 發送請求end,表示已經發送完成
// 3 服務器已經返回數據了,正在接收數據
// 4 接收數據完成
if(xhr.readyState == 4){
if(xhr.status == 200){
if(typeof data.success == "function"){
// 調用回調函數,傳入服務器返回的結果
data.success(xhr.responseText);
}
else if(typeof data.error == "function"){
data.error();
}
}
}
}
// 調用
ajax(data);