在Web用戶端使用xmlhttp對象,可以十分友善的和伺服器交換資料,我們可以擷取和發送任何類型的資料,甚至二進制資料到伺服器上。xmlhttp技術同時也是目前大多數無重新整理頁面使用的和伺服器交換資料的方式,這種方式比以往的隐藏iframe的方法要友善和經濟的多。
Netscape/Mozilla, 和Safari都支援。在IE中我們使用new
ActiveXObject('MSXML2.XMLHTTP')或者new
ActiveXObject("Microsoft.XMLHTTP")來獲得的xmlhttp對象執行個體,使用前者還是後者和用戶端機器安裝的MSXML版本有關。在Netscape/Mozilla和Safari中,使用new
XMLHttpRequest()來獲得xmlhttp對象執行個體。比如在IE中,我們通常這樣使用:
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
var xmlhttp = null;
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
try
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
{
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
xmlhttp = new ActiveXObject("MSXML2.XMLHTTP");
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
}
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
catch(e)
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
try
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
{
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
}
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
catch(e2){}
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
使用xmlhttp對象其實是并不是什麼困難的事,它一共就6個方法8個屬性。不過它最主要的是提供了兩種執行模式:同步模式和異步模式。同步模式可以比較精确的控制程式流程,可是如果伺服器的Response太慢,browser會有死掉失去相應的問題;而使用異步模式由于是事件觸發方式控制流程,會給程式運作帶來一些不可與預計的問題,因為你不知道用戶端等待伺服器Response的過程中,使用者會在browser裡做什麼操作
。
下面是一個同步方式擷取伺服器資料的簡單示例:
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
function GetRemoteData(url)
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
{
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
try
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
{
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
xmlhttp.open('GET', url, false);
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
if ( xmlhttp.status == 200 )
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
{
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
return xmlhttp.responseText;
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
}
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
throw '';
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
}
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
catch(e)
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
{
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
return '';
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
}
XMLHTTP對象的屬性和方法清單(來自IXMLHTTPRequest接口):
Name
Type
Description
onreadystatechange
N/A
指定當就緒狀态發生改變時調用的事件處理函數,僅用于異步操作
readyState
Long
異步操作的狀态:未初始化(0),正在加載(1),已加載(2),互動(3),已完成(4)
responseBody
Variant
将響應資訊正文作為unsigned byte數組傳回
responseStream
将響應資訊正文作為一個ADO Stream對象傳回
responseText
String
将響應資訊正文作為一個文本字元串傳回
responseXML
Object
通過XMLDom将響應資訊正文解析為XMLDocument對象
status
伺服器傳回的HTTP狀态碼
statusText
伺服器HTTP響應行狀态
Desciption
abort
取消目前 HTTP 請求
getAllResponseHeaders
從響應資訊中檢索所有的标頭字段
getResponseHeader
從響應資訊正文中獲得一個 HTTP 标頭值
open(method, url, boolAsync, bstrUser, bstrPassword)
打開一個與 HTTP 伺服器的連接配接
send(varBody)
設定一個請求的标頭字段
setRequestHeader(bstrHeader, bstrValue)
向 HTTP 伺服器發送請求。可包含正文。
這裡面顯然就open方法比較麻煩,帶了一大堆參數,它們的含義分别是:
Parameter
method
HTTP的通信方式,比如GET, HEAD, POST, PUT, DELETE, CONNECT等
url
接收資料的伺服器的URL位址,URL可帶QueryString
boolAsync
一個布爾辨別,說明請求是否為異步的。如果是異步通信方式,用戶端就不等待伺服器的響應;如果是同步方式,客戶機會等到伺服器傳回消息後才去執行其它操作
bstrUser
使用者ID,用于伺服器身份驗證
bstrPassword
使用者密碼,用于伺服器身份驗證
異步通訊的示例:
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
xmlhttp.open("GET", "default.aspx", true);
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
xmlhttp.onreadystatechange = function()
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
if ( xmlhttp.readyState==4 )
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
alert(xmlhttp.responseText);
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
![](https://img.laitimes.com/img/9ZDMuAjOiMmIsIjOiQnIsIiZpdmLl52bO9CXzJ3b0F2YpRmbJdmbp5WasRXdP9CXzV2Zh1WSvwVbvNmLzd2bsJmbj5yd3d3Lc9CX6MHc0RHaiojIsJye.gif)
xmlhttp.send(null);
本文轉自部落格園鳥食軒的部落格,原文連結:http://www.cnblogs.com/birdshome/,如需轉載請自行聯系原部落客。