一、XMLHttpRequest的方法
| 方法 |
描述 |
| abort() |
停止當前請求 |
| getAllResponseHeaders() |
把HTTP請求的所有響應首部作為鍵/值對返回 |
| getResponseHeader("header") |
返回指定首部的串值 |
| open("method","url) |
建立對服務器的調用。Method參數可以是GET、POST或PUT。URL參數可以是相對URL或絕對URL |
| send(content) |
向服務器發送請求 |
| setRequestHeader("header","value") |
把指定首部設置為所提供的值。在設置任何首部之前必須先調用open()方法 |
二、XMLHttpRequest的屬性
| 屬性 |
描述 |
| onreadystatechange |
每個狀態改變都會觸發這個事件處理器，通常會調用一個JavaScript函數 |
| readyState |
請求的狀態，有5個可取值：0=未初始化、1=正在加載、2=已經加載、3=交互中、4=完成。 |
| responseText |
服務器的響應，表示為一個串 |
| responseXML |
服務器的響應，表示為XML。這個對象可以解析為DOM對象 |
| status |
服務器的HTTP狀態碼（200對應OK、404對應NOtFont等） |
| statusText |
HTTP狀態碼的相應文本（OK或NotFount） |
①、onreadystatechange
- 該事件處理函數由服務器觸發，而不是用戶
- 在Ajax執行過程中，服務器會通知客戶端當前的通信狀態。這依靠更新XMLHttpRequest對象的readyState 來實現。改變readyState屬性是服務器對客戶端連接操作的一種方式。每次readyState屬性的改變都會觸發onreadystatechange事件
②、send(data)
- 若選用的是GET請求，則不會發送任何數據，給send方法傳遞null即可
③、setRequestHeader(header,value)
- 如果用POST請求向服務器發送數據，需要將"Content-type"設置為“application/x-www-form-urlencoded”.它會告知服務器正在發送數據，並且數據已經符合URL編碼了。
- 該方法必須在open()之后才能使用
④、responseText
- XMLHttpRequest的responseText 屬性包含了從服務器發送的數據。它是一個HTML，XM或普通文本，這取決於服務器發送的內容。
- 當readyState屬性變為4時，responseText屬性才可用，表明Ajax請求已經結束
Demo
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript">
window.onload=function(){
//1.獲取a節點，並為其添加onclick響應函數
document.getElementsByTagName("a")[0].onclick=function(){
//3.創建一個XMLHttpRequest對象
var request=new XMLHttpRequest();
//4.准備發送請求的數據：url
var url=this.href +"?time="+new Date();
var method="GET";
//var method="POST"
//5.調用xmlhttprequest對象的open方法
request.open(method,url);
//request.setRequestHeader("ContentType","application/x-www-form-urlencoded");
//6.調用xmlhttprequest對象的send方法,get請求參數為null
request.send(null);
//request.send("name='aaa'");
//7.為xmlhttprequest對象添加onreadystatechange響應函數
request.onreadystatechange=function(){
//8.決斷響應是否完成：xmlhttprequest對象的readystate屬性值為4
if(request.readyState==4){
//9.再決斷響應是否可用：xmlhttprequest對象status屬性值為200
if(request.status==200){
//10.打印響應結果：responseText
alert(request.responseText);
}
}
}
//取消a節點的默認行為
return false;
}
}
</script>
</head>
<body>
<a href="helloAjax.txt">HelloAjax</a>
</body>
</html>
