readyState屬性值表

readyState取值	描述
0	描述一種"未初始化"狀態(tài)；此時(shí)，已經(jīng)創(chuàng)建一個(gè)XMLHttpRequest對(duì)象，但是還沒(méi)有初始化。
1	描述一種"發(fā)送"狀態(tài)；此時(shí)，代碼已經(jīng)調(diào)用了XMLHttpRequest open()方法并且XMLHttpRequest已經(jīng)準(zhǔn)備好把一個(gè)請(qǐng)求發(fā)送到服務(wù)器。
2	描述一種"發(fā)送"狀態(tài)；此時(shí)，已經(jīng)通過(guò)send()方法把一個(gè)請(qǐng)求發(fā)送到服務(wù)器端，但是還沒(méi)有收到一個(gè)響應(yīng)。
3	描述一種"正在接收"狀態(tài)；此時(shí)，已經(jīng)接收到HTTP響應(yīng)頭部信息，但是消息體部分還沒(méi)有完全接收結(jié)束。
4	描述一種"已加載"狀態(tài)；此時(shí)，響應(yīng)已經(jīng)被完全接收。

　　2、responseText

　　responseText屬性包含客戶端接收到的HTTP響應(yīng)的文本內(nèi)容。當(dāng)readyState值為0、1、2時(shí)，responseText包含一個(gè)空字符串。當(dāng)readyState值為3(正在接收)時(shí)，響應(yīng)中包含客戶端還未完成的響應(yīng)信息。當(dāng)readyState為4時(shí)(以加載)時(shí)，responseText包含了完整的響應(yīng)信息。

　　3、responseXML

　　此responseXML屬性用于當(dāng)接收到完整的HTTP響應(yīng)時(shí)(readyState為4)描述XML響應(yīng)。此時(shí)，Content-Type頭部指定MIME(多功能網(wǎng)際郵件擴(kuò)充協(xié)議)類(lèi)型為text/xml，application/xml或以+xml結(jié)尾。如果Content-Type頭部并不包含這些媒體類(lèi)型之一，那么responseXML的值為null。無(wú)論何時(shí)，只要readyState值不為4，那么該responseXML的值也為null。其實(shí)，這個(gè)responseXML屬性值是一個(gè)文檔接口類(lèi)型的對(duì)象，用來(lái)描述被分析的文檔。如果文檔不能被分析(例如，如果文檔不是良構(gòu)的或不支持文檔相應(yīng)的字符編碼)，那么responseXML的值將為null。

　　4、status

　　status屬性描述了HTTP請(qǐng)求的狀態(tài)代碼，其類(lèi)型為short類(lèi)型。而且僅當(dāng)readyState值為3或4時(shí)，status屬性才可以用，否則，就會(huì)引發(fā)異常。注：鑒于status的屬性值較多，此處列舉兩個(gè)重要的屬性：200表示OK，一切正常；400表示Bad Request，請(qǐng)求出現(xiàn)語(yǔ)法錯(cuò)誤。

　　5、statusText

　　statusText屬性描述了HTTP狀態(tài)代碼文本，僅當(dāng)readyState值為3或4的時(shí)候才能使用。當(dāng)readyState為其它值時(shí)視圖存取statusText屬性將引發(fā)異常。

二、事件

　　onreadystatechange事件：XHR中的重要事件。當(dāng)readyState值發(fā)生變化的時(shí)候，XHR對(duì)象都會(huì)激發(fā)一個(gè)onreadystatechange事件。其中，onreadystatechange屬性接收一個(gè)EventListener值向該方法指示無(wú)論readyState何時(shí)發(fā)生改變，該對(duì)象都將激活。

　　XHR對(duì)象的方法

　　1、abort()方法

　　你可以使用這個(gè)abort()方法來(lái)暫停與一個(gè)XMLHttpRequest對(duì)象相聯(lián)系的HTTP請(qǐng)求，從而把該對(duì)象復(fù)位到未初始化狀態(tài)。

　　2、open()方法

　　你需要調(diào)用open(DOMString method，DOMString uri，boolean async，DOMString username，DOMString password)方法初始化一個(gè)XMLHttpRequest對(duì)象。其中，method參數(shù)是必須提供的-用于指定你想用來(lái)發(fā)送請(qǐng)求的HTTP方法(GET，POST，PUT，DELETE或HEAD)。為了把數(shù)據(jù)發(fā)送到服務(wù)器，應(yīng)該使用POST方法；為了從服務(wù)器端檢索數(shù)據(jù)，應(yīng)該使用GET方法。在調(diào)用open()方法后，XMLHttpRequest對(duì)象把它的readyState屬性設(shè)置為1(打開(kāi))并且把responseText、responseXML、status和statusText屬性復(fù)位到它們的初始值。另外，它還復(fù)位請(qǐng)求頭部。注意，如果你調(diào)用open()方法并且此時(shí)readyState為4，則XMLHttpRequest對(duì)象將復(fù)位這些值。

　　3、send()方法

　　在通過(guò)調(diào)用open()方法準(zhǔn)備好一個(gè)請(qǐng)求之后，你需要把該請(qǐng)求發(fā)送到服務(wù)器。僅當(dāng)readyState值為1時(shí)，你才可以調(diào)用send()方法；否則的話，XMLHttpRequest對(duì)象將引發(fā)一個(gè)異常。該請(qǐng)求被使用提供給open()方法的參數(shù)發(fā)送到服務(wù)器。當(dāng)async參數(shù)為true時(shí)，send()方法立即返回，從而允許其它客戶端腳本處理繼續(xù)。在調(diào)用send()方法后，XMLHttpRequest對(duì)象把readyState的值設(shè)置為2(發(fā)送)。當(dāng)服務(wù)器響應(yīng)時(shí)，在接收消息體之前，如果存在任何消息體的話，XMLHttpRequest對(duì)象將把readyState設(shè)置為3(正在接收中)。當(dāng)請(qǐng)求完成加載時(shí)，它把readyState設(shè)置為4(已加載)。對(duì)于一個(gè)HEAD類(lèi)型的請(qǐng)求，它將在把readyState值設(shè)置為3后再立即把它設(shè)置為4。send()方法使用一個(gè)可選的參數(shù)-該參數(shù)可以包含可變類(lèi)型的數(shù)據(jù)。典型地，你使用它并通過(guò)POST方法把數(shù)據(jù)發(fā)送到服務(wù)器。另外，你可以顯式地使用null參數(shù)調(diào)用send()方法，這與不用參數(shù)調(diào)用它一樣。對(duì)于大多數(shù)其它的數(shù)據(jù)類(lèi)型，在調(diào)用send()方法之前，應(yīng)該使用setRequestHeader()方法(見(jiàn)后面的解釋)先設(shè)置Content-Type頭部。如果在send(data)方法中的data參數(shù)的類(lèi)型為DOMString，那么，數(shù)據(jù)將被編碼為UTF-8。如果數(shù)據(jù)是Document類(lèi)型，那么將使用由data.xmlEncoding指定的編碼串行化該數(shù)據(jù)。

　　4、setRequestHeader()方法

　　該setRequestHeader(DOMString header，DOMString value)方法用來(lái)設(shè)置請(qǐng)求的頭部信息。當(dāng)readyState值為1時(shí)，你可以在調(diào)用open()方法后調(diào)用這個(gè)方法；否則，你將得到一個(gè)異常。

　　5、getResponseHeader()方法

　　getResponseHeader(DOMString header，value)方法用于檢索響應(yīng)的頭部值。僅當(dāng)readyState值是3或4(換句話說(shuō)，在響應(yīng)頭部可用以后)時(shí)，才可以調(diào)用這個(gè)方法；否則，該方法返回一個(gè)空字符串。

　　6、getAllResponseHeaders()方法

　　該getAllResponseHeaders()方法以一個(gè)字符串形式返回所有的響應(yīng)頭部（每一個(gè)頭部占單獨(dú)的一行）。如果readyState的值不是3或4，則該方法返回null。

　　下面是一個(gè)簡(jiǎn)單的實(shí)例代碼：

　　此方法實(shí)現(xiàn)一個(gè)簡(jiǎn)單的檢測(cè)數(shù)據(jù)庫(kù)中的用戶名是否已經(jīng)存在方法，訪問(wèn)一個(gè)已經(jīng)寫(xiě)好的服務(wù)

<script language="javascript" type="text/javascript">
     var  xhr;
    
    if(window.ActiveXObject)//判斷瀏覽器是否支持ActiveX
        xhr = new ActiveXObject('Microsoft.XMLHTTP');
    else if (window.XMLHttpRequest)//判斷瀏覽器是否支持XHR
        xhr = new  XMLHttpRequest();
       
    function  send()//自定義方法
        {
            var checkname = document.getElementById("tbxName").value;
           
            xhr.open("POST","http://localhost:1956/CheckBySql/Service.asmx",true);

            xhr.SetRequestHeader ("Content-Type","text/xml; charset=utf-8");
            xhr.SetRequestHeader ("SOAPAction","http:///IsExist");
            var  data="<?xml version=\"1.0\" encoding=\"utf-8\"?><soap:Envelope xmlns:xsi=\"http://www./2001/XMLSchema-instance\" xmlns:xsd=\"http://www./2001/XMLSchema\" xmlns:soap=\"http://schemas./soap/envelope/\"><soap:Body><IsExist xmlns=\"http:///\"><name>" + checkname + "</name></IsExist></soap:Body></soap:Envelope>";
            xhr.onreadystatechange=processRequest; //事件處理，processRequeset是個(gè)處理方法
            xhr.send(data);
        }
       
        function processRequest()
         {
           //alert(xh.responseText);
           if(xh.readyState==4) //接受完畢
　　         {
　　          if(xh.status==200)//正確 401代表錯(cuò)誤
　　            {
                    var pat= new RegExp("<IsExistResult>([\\w\\W]*?)<\\/IsExistResult>","i");
                    var ar=pat.exec(xh.responseText);
                    var x = ar[0].replace("<IsExistResult>","");
                    var y = x.replace("</IsExistResult>","");
                    var result = parseInt(y);
                    if(result == 1)
                    {
                        document.getElementById("lblMsg").innerHTML = "用戶名已存在!";
                    }
                    else
                    {
                        document.getElementById("lblMsg").innerHTML = "用戶名可以使用!";
                    }
                 }
　　          }
　       }
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table class="style1">
            <tr>
                <td style="width: 50px">
                    <asp:Label ID="lblName" runat="server" Text="姓名："></asp:Label>
                </td>
                <td style="width: 129px">
                    <asp:TextBox ID="tbxName" runat="server" onblur="javascript:send();"></asp:TextBox>
                </td>
                <td>
                    <asp:Label ID="lblMsg" runat="server"></asp:Label>
                </td>
            </tr>

　　　</table>
    </div>
    </form>
</body>
</html>

　　總結(jié)：通過(guò)對(duì)XHR對(duì)象的使用，使我們可以在不刷新頁(yè)面的情況下也可以更新數(shù)據(jù)。大大減輕了頁(yè)面服務(wù)端的負(fù)擔(dān)，是用戶的感覺(jué)更加直觀，使瀏覽器的交互能力大大加強(qiáng)！