了解Ajax的工作原理,就要從理解XMLHttpRequest這個對象開始。

下面給出將要用於該對象的很少的幾個 方法和屬性。

　 ·open()：建立到服務器的新請求。

　 　·send()：向服務器發送請求。

　 　·abort()：退出當前請求。

　　·readyState：提供當前 HTML 的就緒狀態。

　　·responseText：服務器返回的請求響應文本。

‘onreadystatechange:回調方法

　·responseXML：服務器返回的請求響應XML形式組織的文本。

獲取響應文本的函數：

function getRepText(url,args,reqstyle="get"){
/*
* 獲取xmlhttp對象
*/
var xmlhttp;
if (window.XMLHttpRequest) xmlhttp=new XMLHttpRequest();
else xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
var resultObject;
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
var result = xmlhttp.responseText;
document.getElementById("json").innerHTML=result;
alert("響應體類型："+typeof result+"\n響應體 ："+result);
resultObject = eval(‘(‘+result+")");
alert(JSON.stringify(resultObject));
};
}
if(reqstyle.toLowerCase()=="get"){
xmlhttp.open("get",url,true);
xmlhttp.send();
}else{
xmlhttp.open("post", url, true);
xmlhttp.setRequestHeader(‘Content-type‘, ‘application/x-www-form-urlencoded‘);
xmlhttp.send(args);
}
if(xmlhttp.readyState==4 && xmlhttp.status==200){
return resultObject;
}
}

原生js ajax實例