設計AJAX時使用的一個重要的技術（工具）就是XMLHTTPRequest物件了。 XMLHttpRequest物件是當今所有AJAX和Web 2.0應用程式的技術基礎。儘管軟體經銷商和開源社團現在都在提供各種AJAX框架以進一步簡化XMLHttpRequest物件的使用；但是，我們仍然很有必要理解這個物件的屬性和方法簡介。
1、XMLHTTPRequest物件什麼是？
最通用的定義為：XmlHttp是一套可以在Javascript、VbScript、Jscript等腳本語言中透過http協定傳送或從接收XML及其他資料的一套API。 XmlHttp最大的用處是可以更新網頁的部分內容而不需要刷新整個頁面。 （這個功能正是AJAX的一大特點之一）
來自MSDN的解釋：XmlHttp提供客戶端同http伺服器通訊的協定。用戶端可以透過XmlHttp物件(MSXML2.XMLHTTP.3.0)向http伺服器傳送請求並使用微軟XML文件物件模型Microsoft? XML Document Object Model (DOM)處理回應。
這裡說些題外話，其實這個東西很早就出現了，只是以前瀏覽器的支援不夠，只有IE中才支持，所以大多數的WEB程式設計師都沒有怎麼用他，但是現在情況發生了很大地改變，Mozilla和Safari把它採用為事實上的標準，主流的瀏覽器都開始支援XMLHTTPRequest物件了。但這裡需要重點說明的是XMLHTTPRequest目前還不是一個W3C的標準，所以在不同的瀏覽器上表現也稍微不同。
2.建立XMLHTTPRequest物件
說到差異，我們在這裡來看看怎麼來宣告（使用）它，在使用XMLHTTPRequest物件發送請求和處理回應之前，我們必須要用javascript建立一個XMLHTTPRequest物件。 （IE把XMLHTTPRequest實作為一個ActiveX對象，其他的瀏覽器[如Firefox/Safari/Opear]則把它實作為一個本地的javascript對象）。下面我們就來看看具體怎麼運用javascript來創建它：
以下是引用片段：
<script language="javascript" type="text/javascript">
<!--
var xmlhttp;
// 建立XMLHTTPRequest對象
function createXMLHTTPRequest(){
if(window.ActiveXObject){ // 判斷是否支援ActiveX控件
xmlhttp = new ActiveObject("Microsoft.XMLHTTP"); // 透過實例化ActiveXObject的一個新實例來建立XMLHTTPRequest對象
}
else if(window.XMLHTTPRequest){ // 判斷是否把XMLHTTPRequest實作為一個本地javascript對象
xmlhttp = new XMLHTTPRequest(); // 建立XMLHTTPRequest的一個實例（本地javascript物件）
}
}
//-->
</script>3、屬性和方法由於東西太多現在先用個頁面來列舉出說有的方法和屬性，以後再來詳細舉例（主要是本人也在學習中）。
<html>
<head>
<title>XMLHTTPRequest物件的說明DEMO</title>
<script language="javascript" type="text/javascript">
<!--
var xmlhttp;
// 建立一個XMLHTTPRequest對象
function createXMLHTTPRequext(){
if(window.ActiveXObject) {
xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
}
else if(window.XMLHTTPRequest){
xmlhttp = new XMLHTTPRequest();
}
}
function PostOrder(xmldoc)
{
createXMLHTTPRequext();
// 方法：open
// 建立一個新的http請求，並指定此請求的方法、URL以及驗證訊息
// 語法：oXMLHttpRequest.open(bstrMethod, bstrUrl, varAsync, bstrUser, bstrPassword);
// 參數
// bstrMethod
// http方法，例如：POST、GET、PUT及PROPFIND。大小寫不敏感。
// bstrUrl
// 請求的URL位址，可以為絕對位址也可以為相對位址。
// varAsync[可選]
// 布林型，指定此請求是否為非同步方式，預設為true。如果為真，當狀態改變時會呼叫onreadystatechange屬性指定的回呼函數。
// bstrUser[可選]
// 如果伺服器需要驗證，此處指定使用者名，如果未指定，當伺服器需要驗證時，會彈出驗證視窗。
// bstrPassword[可選]
// 驗證訊息中的密碼部分，如果使用者名為空，則此值將被忽略。
// 備註：呼叫此方法後，可以呼叫send方法向伺服器傳送資料。
xmlhttp.Open("get", " http://localhost/example.htm ", false);
// var book = xmlhttp.responseXML.selectSingleNode("//book[@id='bk101']");
// alert(book.xml);
// 屬性：onreadystatechange
// onreadystatechange：指定當readyState屬性改變時的事件處理句柄
// 語法：oXMLHttpRequest.onreadystatechange = funcMyHandler;
// 如下的範例示範當XMLHTTPRequest物件的readyState屬性改變時呼叫HandleStateChange函數，
// 當資料接收完畢後（readystate == 4）此頁面上的一個按鈕將會被啟動
// 備註：此屬性只寫，為W3C文檔物件模型的擴充.
xmlhttp.onreadystatechange= HandleStateChange;
// 方法：send
// 發送請求到http伺服器並接收回應
// 語法：oXMLHttpRequest.send(varBody);
// 參數：varBody （欲透過此請求傳送的資料。）
// 備註：此方法的同步或非同步方式取決於open方法中的bAsync參數，如果bAsync == False，此方法將會等待請求完成或逾時時才會返回，如果bAsync == True，此方法將立即返回。
// This method takes one optional parameter, which is the requestBody to use. The acceptable VARIANT input types are BSTR, SAFEARRAY of UI1 (unsigned bytes), IDispatch to an XML Document Object Model (DOMStream Object Model, and IStream Aobject, and IStream ” use only chunked encoding (for sending) when sending IStream * input types. The component automatically sets the Content-Length header for all but IStream * input types.
// 如果傳送的資料為BSTR，則回應被編碼為utf-8, 必須在適當位置設定一個包含charset的文件類型頭。
// If the input type is a SAFEARRAY of UI1, the response is sent as is without additional encoding. The caller must set a Content-Type header with the appropriate content type.
// 如果發送的資料為XML DOM object，則回應將被編碼為在xml文檔中聲明的編碼，如果在xml文檔中沒有聲明編碼，則使用預設的UTF-8。
// If the input type is an IStream *, the response is sent as is without additional encoding. The caller must set a Content-Type header with the appropriate content type.
xmlhttp.Send(xmldoc);
// 方法：getAllResponseHeaders
// 所有取得回應的http頭
// 語法：strValue = oXMLHttpRequest.getAllResponseHeaders();
// 備註：每個http頭名稱和值以冒號分割，並以rn結束。當send方法完成後才可呼叫此方法。
alert(xmlhttp.getAllResponseHeaders());
// 方法：getResponseHeader
// 從回應資訊中取得指定的http頭
// 語法：strValue = oXMLHttpRequest.getResponseHeader(bstrHeader);
// 備註：send方法成功後才可呼叫此方法。如果伺服器傳回的文檔類型為"text/xml", 則這句話
// xmlhttp.getResponseHeader("Content-Type");將傳回字串"text/xml"。可以使用getAllResponseHeaders方法取得完整的http頭資訊。
alert(xmlhttp.getResponseHeader("Content-Type")); // 輸出http頭中的Content-Type欄位：目前web伺服器的版本及名稱。
document.frmTest.myButton.disabled = true;
// 方法：abort
// 取消目前請求
// 語法：oXMLHttpRequest.abort();
// 備註：呼叫此方法後，目前請求傳回UNINITIALIZED 狀態。
// xmlhttp.abort();
// 方法：setRequestHeader
// 單獨指定請求的某個http頭
// 語法：oXMLHttpRequest.setRequestHeader(bstrHeader, bstrValue);
// 參數：bstrHeader（字串，頭名。）
// bstrValue（字串，值。）
// 備註：如果已經存在已此名稱命名的http頭，則覆蓋之。此方法必須在open方法後呼叫。
// xmlhttp.setRequestHeader(bstrHeader, bstrValue);
}
function HandleStateChange()
{
// 屬性：readyState
// 傳回XMLHTTP請求的目前狀態
// 語法：lValue = oXMLHttpRequest.readyState;
// 備註：變量，此屬性只讀，狀態用長度為4的整型表示.定義如下：
// 0 (未初始化) 物件已建立，但是尚未初始化（尚未呼叫open方法）
// 1 (初始化) 物件已建立，尚未呼叫send方法
// 2 (傳送資料) send方法已調用，但是目前的狀態及http頭未知
// 3 (資料傳送中) 已接收部分數據，因為回應及http頭不全，這時透過responseBody和responseText取得部分資料會出現錯誤，
// 4 (完成) 資料接收完畢,此時可以透過responseBody和responseText取得完整的回應數據
if (xmlhttp.readyState == 4){
document.frmTest.myButton.disabled = false;
// 屬性：responseBody
// 傳回某一格式的伺服器回應數據
// 語法：strValue = oXMLHttpRequest.responseBody;
// 備註：變量，此屬性只讀，以unsigned array格式表示直接從伺服器傳回的未經解碼的二進位資料。
alert(xmlhttp.responseBody);
// 屬性：responseStream
// 以Ado Stream物件的形式回傳回應訊息
// 語法：strValue = oXMLHttpRequest.responseStream;
// 備註：變量，此屬性只讀，以Ado Stream物件的形式傳回回應訊息。
alert(xmlhttp.responseStream);
// 屬性：responseText
// 將回應訊息作為字串傳回
// 語法：strValue = oXMLHttpRequest.responseText;
// 備註：變量，此屬性只讀，將回應資訊作為字串傳回。 XMLHTTP嘗試將回應訊息解碼為Unicode字串，
// XMLHTTP預設將回應資料的編碼定為UTF-8，如果伺服器傳回的資料帶BOM(byte-order mark)，XMLHTTP可
// 以解碼任何UCS-2 (big or little endian)或UCS-4 資料。注意，如果伺服器傳回的是xml文檔，此屬
// 性並不會處理xml文檔中的編碼聲明。你需要使用responseXML來處理。
alert(xmlhttp.responseText);
// 屬性：responseXML
// 將回應訊息格式化為Xml Document物件並傳回
// 語法：var objDispatch = oXMLHttpRequest.responseXML;
// 備註：變量，此屬性只讀，將回應資訊格式化為Xml Document物件並傳回。如果回應資料不是有效的XML文檔，
// 此屬性本身不會傳回XMLDOMParseError，可以透過處理過的DOMDocument物件取得錯誤訊息。
alert("Result = " + xmlhttp.responseXML.xml);
// 屬性：status
// 傳回目前請求的http狀態碼
// 語法：lValue = oXMLHttpRequest.status;
// 傳回值：長整形標準http狀態碼，定義如下：
// Number:Description
// 100:Continue
// 101:Switching protocols
// 200:OK
// 201:Created
// 202:Accepted
// 203:Non-Authoritative Information
// 204:No Content
// 205:Reset Content
// 206:Partial Content
// 300:Multiple Choices
// 301:Moved Permanently
// 302:Found
// 303:See Other
// 304:Not Modified
// 305:Use Proxy
// 307:Temporary Redirect
// 400:Bad Request
// 401:Unauthorized
// 402:Payment Required
// 403:Forbidden
// 404:Not Found
// 405:Method Not Allowed
// 406:Not Acceptable
// 407:Proxy Authentication Required
// 408:Request Timeout
// 409:Conflict
// 410:Gone
// 411:Length Required
// 412:Precondition Failed
// 413:Request Entity Too Large
// 414:Request-URI Too Long
// 415:Unsupported Media Type
// 416:Requested Range Not Suitable
// 417:Expectation Failed
// 500:Internal Server Error
// 501:Not Implemented
// 502:Bad Gateway
// 503:Service Unavailable
// 504:Gateway Timeout
// 505:HTTP Version Not Supported
// 備註：長整形，此屬性只讀，傳回目前請求的http狀態碼,此屬性僅當資料傳送並接收完畢後才可取得。
alert(xmlhttp.status);
// 屬性：statusText
// 傳回目前請求的回應行狀態
// 語法：strValue = oXMLHttpRequest.statusText;
// 備註：字串，此屬性只讀，以BSTR傳回目前請求的回應行狀態,此屬性僅當資料傳送並接收完畢後才可取得。
alert(xmlhttp.statusText);
}
}
//-->
</script>
</head>
<body>
<form name="frmTest">
<input name="myButton" type="button" value="Click Me" onclick="PostOrder('http://localhost/example.htm');">
</form>
</body>
</html>