XMLHttpRequest 對象

XMLHttpRequest 對象提供了在網(wǎng)頁加載后與服務(wù)器進(jìn)行通信的方法。

目錄: 1、什么是 XMLHttpRequest 對象？; 2、創(chuàng)建 XMLHttpRequest 對象; 3、實(shí)例; 4、為什么使用 Async=true ？; 5、更多實(shí)例; 6、XML / ASP; 7、XMLHttpRequest 對象是 W3C 的標(biāo)準(zhǔn)嗎？; 8、參閱

什么是 XMLHttpRequest 對象？

XMLHttpRequest 對象是開發(fā)者的夢想，因?yàn)槟軌颍?/p>

在不重新加載頁面的情況下更新網(wǎng)頁
在頁面已加載后從服務(wù)器請求數(shù)據(jù)
在頁面已加載后從服務(wù)器接收數(shù)據(jù)
在后臺向服務(wù)器發(fā)送數(shù)據(jù)

所有現(xiàn)代的瀏覽器都支持 XMLHttpRequest 對象。

實(shí)例：當(dāng)鍵入文本時(shí)與服務(wù)器進(jìn)行 XML HTTP 通信。

創(chuàng)建 XMLHttpRequest 對象

通過一行簡單的 JavaScript 代碼，我們就可以創(chuàng)建 XMLHttpRequest 對象。

在所有現(xiàn)代瀏覽器中（包括 IE 7）：

xmlhttp=new XMLHttpRequest()

在 Internet Explorer 5 和 6 中：

xmlhttp=new ActiveXObject("Microsoft.XMLHTTP")

實(shí)例

<script type="text/javascript"> var xmlhttp; function loadXMLDoc(url) { xmlhttp=null; if (window.XMLHttpRequest) {// code for all new browsers xmlhttp=new XMLHttpRequest(); } else if (window.ActiveXObject) {// code for IE5 and IE6 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } if (xmlhttp!=null) { xmlhttp.onreadystatechange=state_Change; xmlhttp.open("GET",url,true); xmlhttp.send(null); } else { alert("Your browser does not support XMLHTTP."); } } function state_Change() { if (xmlhttp.readyState==4) {// 4 = "loaded" if (xmlhttp.status==200) {// 200 = OK // ...our code here... } else { alert("Problem retrieving XML data"); } } } </script>

TIY

注釋：onreadystatechange 是一個(gè)事件句柄。它的值 (state_Change) 是一個(gè)函數(shù)的名稱，當(dāng) XMLHttpRequest 對象的狀態(tài)發(fā)生改變時(shí)，會觸發(fā)此函數(shù)。狀態(tài)從 0 (uninitialized) 到 4 (complete) 進(jìn)行變化。僅在狀態(tài)為 4 時(shí)，我們才執(zhí)行代碼。

為什么使用 Async=true ？

我們的實(shí)例在 open() 的第三個(gè)參數(shù)中使用了 "true"。

該參數(shù)規(guī)定請求是否異步處理。

True 表示腳本會在 send() 方法之后繼續(xù)執(zhí)行，而不等待來自服務(wù)器的響應(yīng)。

onreadystatechange 事件使代碼復(fù)雜化了。但是這是在沒有得到服務(wù)器響應(yīng)的情況下，防止代碼停止的最安全的方法。

通過把該參數(shù)設(shè)置為 "false"，可以省去額外的 onreadystatechange 代碼。如果在請求失敗時(shí)是否執(zhí)行其余的代碼無關(guān)緊要，那么可以使用這個(gè)參數(shù)。

TIY

XML / ASP

您也可以把 XML 文檔打開并發(fā)送到服務(wù)器上的 ASP 頁面，分析此請求，然后傳回結(jié)果。

<html> <body> <script type="text/javascript"> xmlHttp=null; if (window.XMLHttpRequest) {// code for IE7, Firefox, Opera, etc. xmlHttp=new XMLHttpRequest(); } else if (window.ActiveXObject) {// code for IE6, IE5 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } if (xmlHttp!=null) { xmlHttp.open("GET", "note.xml", false); xmlHttp.send(null); xmlDoc=xmlHttp.responseText; xmlHttp.open("POST", "demo_dom_http.asp", false); xmlHttp.send(xmlDoc); document.write(xmlHttp.responseText); } else { alert("Your browser does not support XMLHTTP."); } </script> </body> </html>

ASP 頁面，由 VBScript 編寫：

<% set xmldoc = Server.CreateObject("Microsoft.XMLDOM") xmldoc.async=false xmldoc.load(request) for each x in xmldoc.documentElement.childNodes if x.NodeName = "to" then name=x.text next response.write(name) %>

通過使用 response.write 屬性把結(jié)果傳回客戶端。

TIY