JS XMLHttpRequest物件的建立

XMLHttpRequest 物件是 Ajax 的基礎，所有現代瀏覽器均支援 XMLHttpRequest 物件（IE 5、IE 6 使用 ActiveXObject）。XMLHttpRequest 用於在後台與伺服器交換資料，這意味著可以在不重新載入整個網頁的情況下，對網頁的某部分進行更新。

在 JavaScript 中，XMLHttpRequest 用於在後台與伺服器交換資料。建立 XMLHttpRequest 物件的方法如下：

var xhr = new XMLHttpRequest ();

IE 5.0 版本開始以 ActiveX 元件形式支援 XMLHttpRequest，IE 7.0 版本開始標準化 XMLHttpRequest。不過所有瀏覽器實現的 XMLHttpRequest 物件都提供相同的介面和用法。

範例

下面範例使用工廠模式把定義 XMLHttpRequest 物件進行封裝，這樣只需要呼叫 creatXHR() 方法就可以返回一個 XMLHttpRequest 物件。

//建立XMLHttpRequest 物件
//引數：無
//返回值：XMLHttpRequest 物件
function createXHR () {
    var XHR = [  //相容不同瀏覽器和版本得建立函數陣列
        function () { return new XMLHttpRequest () },
        function () { return new ActiveXObject ("Msxml2.XMLHTTP") },
        function () { return new ActiveXObject ("Msxml3.XMLHTTP") },
        function () { return new ActiveXObject ("Microsoft.XMLHTTP") }
    ];
    var xhr = null;
    //嘗試呼叫函數，如果成功則返回XMLHttpRequest物件，否則繼續嘗試
    for (var i = 0; i < XHR.length; i ++) {
        try {
            xhr = XHR[i]();
        } catch(e) {
            continue  //如果發生異常，則繼續下一個函數呼叫
        }
        break;  //如果成功，則中止迴圈
    }
    return xhr;  //返回物件範例
}

在上面程式碼中，首先定義一個陣列，收集各種建立 XMLHttpRequest 物件的函數。第 1 個函數是標準用法，其他函數主要針對 IE 瀏覽器的不同版本嘗試建立 ActiveX 物件。然後設定變數 xhr 為 null，表示為空物件。接著遍歷工廠內所有函數並嘗試執行它們，為了避免發生異常，把所有呼叫函數放在 try 中執行，如果發生錯誤，則在 catch 中捕獲異常並執行 continue 命令，返回繼續執行，避免丟擲異常。如果建立成功，則中止迴圈，返回 XMLHttpRequest 物件。