創建ajax步驟:創建ajax對象、連接到服務器、發送請求、接收返回值。實例如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>my ajax</title>
<script type="text/javascript">
window.onload = function(){
var oBtn = document.getElementById('btn1');
oBtn.onclick = function(){
//1.創建一個ajax對象
var oAjax = new XMLHttpRequest();
//2.連接服務器
//open(方法,文件名,異步傳輸)
oAjax.open('GET','abc.txt?t='+new Date().getTime(),true); //?去緩存
//3.發送請求
oAjax.send();
//4.接收返回信息
oAjax.onreadystatechange = function(){
/*readyState =
0 (未初始化)還沒有調用open()方法
1 (載入)已調用send()方法,正在發送請求
2 (載入完成)send()方法完成,已收到全部響應內容
3 (解析)正在解析響應內容
4 (完成)響應內容解析完成,可以在客戶端調用了
*/
if(oAjax.readyState==4) //讀取完成
{
if(oAjax.status == 200) //status表示請求結果,200表示讀取成功,除了200基本都是失敗
{
alert("success:"+oAjax.responseText);
}
else{
alert("failed:"+oAjax.status);
}
}
};
};
};
</script>
</head>
<body>
<input id="btn1" type="button" value="按鈕"></input>
</body>
</html>
注意:該例程需要在本地服務器上運行,不然無法使用ajax。