XMLHttpRequest(XHR)
Ø 瀏覽器可以直接從JavaScript中初始化請(qǐng)求并獲取結(jié)果。
Ø 本質(zhì)上是添加了額外的用于發(fā)送和接收XML代碼功能的普通HTTP請(qǐng)求。
Ø 像一個(gè) ServletRequest
XMLHttpRequest對(duì)象的屬性和事件
Ø XMLHttpRequest對(duì)象的屬性
屬性名稱 |
描述 |
onreadystatechange |
指定當(dāng)readyState屬性改變時(shí)的事件處理句柄,只寫 。 |
readyState |
返回當(dāng)前請(qǐng)求的狀態(tài),只讀。 |
responseBody |
將回應(yīng)信息正文以unsigned byte數(shù)組形式返回,只讀。 |
responseStream |
以Ado Stream對(duì)象的形式返回響應(yīng)信息,只讀 。 |
responseText |
將響應(yīng)信息作為字符串返回,只讀 。 |
responseXML |
將響應(yīng)信息格式化為Xml Document對(duì)象并返回,只讀 。 |
status |
返回當(dāng)前請(qǐng)求的http狀態(tài)碼,只讀 。 |
statusText |
返回當(dāng)前請(qǐng)求的響應(yīng)行狀態(tài),只讀 。 |
XMLHttpRequest對(duì)象的方法
Ø XMLHttpRequest對(duì)象的方法
方法名稱 |
描述 |
abort |
取消當(dāng)前請(qǐng)求 |
getAllResponseHeaders |
獲取響應(yīng)的所有http頭 |
getResponseHeader |
從響應(yīng)信息中獲取指定的http頭 |
open |
創(chuàng)建一個(gè)新的http請(qǐng)求,并指定此請(qǐng)求的方法、URL以及驗(yàn)證信息(用戶名/密碼) //常用 |
send |
發(fā)送請(qǐng)求到http服務(wù)器并接收回應(yīng) //常用 |
setRequestHeader |
單獨(dú)指定請(qǐng)求的某個(gè)http頭 |
XMLHttpRequest對(duì)象的readyState屬性
Ø ReadyState屬性
屬性名稱 |
描述 |
0 (未初始化) |
對(duì)象已建立,但是尚未初始化(尚未調(diào)用open方法) |
1 (初始化) |
對(duì)象已建立,尚未調(diào)用send方法 |
2 (發(fā)送數(shù)據(jù)) |
send方法已調(diào)用,但是當(dāng)前的狀態(tài)及http頭未知 |
3 (數(shù)據(jù)傳送中) |
已接收部分?jǐn)?shù)據(jù),因?yàn)轫憫?yīng)及http頭不全,這時(shí)通過responseBody和responseText獲取部分?jǐn)?shù)據(jù)會(huì)出現(xiàn)錯(cuò)誤 |
4 (完成) |
數(shù)據(jù)接收完畢,此時(shí)可以通過通過responseBody和responseText獲取完整的回應(yīng)數(shù)據(jù) |
XMLHttpRequest對(duì)象的onreadystatechange事件
Ø 每個(gè)狀態(tài)改變時(shí)都會(huì)觸發(fā)這個(gè)事件處理器,通常會(huì)調(diào)用一個(gè)JavaScript 函數(shù)。
Ø 語法
onreadystatechang 指定當(dāng)readyState屬性改變時(shí)的事件處理句柄,只寫 xmlHttpObj.onreadystatechange=callback; function callback (){ if(xmlHttpObj.readyState==4){ if(xmlHttpObj.stateus==200){ alert(xmlHttpObj.responseText); }else{ alert("加載失敗!"n原因:"+xmlHttpObj.stateText); } } } |
XMLHttpRequest對(duì)象的responseText屬性
Ø 服務(wù)器的響應(yīng),表示為一個(gè)串。
Ø 客戶端接收到的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í),該responseText包含完整的響應(yīng)信息。
XMLHttpRequest對(duì)象的responseXML屬性
Ø 服務(wù)器的響應(yīng),表示為XML。
Ø 用于當(dāng)接收到完整的HTTP響應(yīng)時(shí)(readyState為4)描述XML響應(yīng)。
Ø Content-Type頭部指定MIME(媒體)類型為text/xml,application/xml或以+xml結(jié)尾。
Ø 如果Content-Type頭部并不包含這些媒體類型之一,那么responseXML的值為null。
Ø 無論何時(shí),只要readyState值不為4,那么該responseXML的值也為null。
Ø responseXML可以返回一個(gè)文檔樹(DOM),可以使用document.getElementsByTagName,document.getElementsByTagNameNS,document.getElementById等對(duì)其操作。
XMLHttpRequest對(duì)象的status屬性
Ø 長整形標(biāo)準(zhǔn)http狀態(tài)碼。
Ø 僅當(dāng)readyState值為3(正在接收中)或4(已加載)時(shí),這個(gè)status屬性才可用。
Ø 當(dāng)readyState的值小于3時(shí)試圖存取status的值將引發(fā)一個(gè)異常。
Ø 狀態(tài)碼如下定義:
值 |
描述 |
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 |
XMLHttpRequest對(duì)象的statusText屬性
Ø 描述了HTTP狀態(tài)代碼文本。
Ø 僅當(dāng)readyState值為3或4才可用。
Ø 當(dāng)readyState為其它值時(shí)試圖存取statusText屬性將引發(fā)一個(gè)異常。
Ø 返回當(dāng)前請(qǐng)求的響應(yīng)行狀態(tài)
XMLHttpRequest對(duì)象的abort()方法
Ø 暫停與一個(gè)XMLHttpRequest對(duì)象相聯(lián)系的HTTP請(qǐng)求。
Ø 從而把該對(duì)象復(fù)位到未初始化狀態(tài)。
Ø 用來中斷請(qǐng)求,取消當(dāng)前請(qǐng)求。
XMLHttpRequest對(duì)象的open()方法
Ø void open(string method, string url, boolean asynch, string username, string password) 建立對(duì)服務(wù)器的連接,初始化一個(gè)XHR對(duì)象的純腳本方法。
1. ethod參數(shù): 是必須提供的-指定發(fā)送請(qǐng)求的HTTP方法(GET,POST,PUT,DELETE或HEAD)。
2. uri參數(shù): 用于指定請(qǐng)求發(fā)送到的服務(wù)器相應(yīng)的URI。
3. async參數(shù): 指定請(qǐng)求是否是異步的,預(yù)設(shè)是true,表示使用非同步方式。為了發(fā)送一個(gè)同步請(qǐng)求,需要把這個(gè)參數(shù)設(shè)置為false。
Ø 對(duì)于要求認(rèn)證的服務(wù)器,提供可選的用戶名和口令參數(shù)。
Ø 在調(diào)用open()方法后,XMLHttpRequest對(duì)象把readyState屬性設(shè)置為1(打開)。
Ø 并且把responseText、responseXML、status和statusText屬性復(fù)位到它們的初始值。
XMLHttpRequest對(duì)象的send()方法
Ø 向服務(wù)器發(fā)送請(qǐng)求。
Ø 僅當(dāng)readyState值為1時(shí),才可以調(diào)用send()方法;否則的話,XHR對(duì)象將引發(fā)一個(gè)異常。
Ø 當(dāng)async參數(shù)為true時(shí),send()方法立即返回,從而允許其它客戶端腳本繼續(xù)處理。
Ø 在調(diào)用send()方法后,XHR對(duì)象把readyState的值設(shè)置為2(發(fā)送)。
Ø 當(dāng)服務(wù)器響應(yīng)時(shí),在接收消息體之前,如果存在任何消息體的話,XHR對(duì)象將把readyState設(shè)置為3(正在接收中)。
Ø 當(dāng)請(qǐng)求完成加載時(shí),它把readyState設(shè)置為4(已加載)。
Ø 對(duì)于一個(gè)HEAD類型的請(qǐng)求,它將在把readyState值設(shè)置為3后再立即把它設(shè)置為4。
Ø send()方法使用一個(gè)可選的參數(shù)-該參數(shù)可以包含可變類型的數(shù)據(jù)。
Ø 通過POST方法把數(shù)據(jù)發(fā)送到服務(wù)器。
Ø 可以顯式地使用null參數(shù)調(diào)用send()方法,這與不用參數(shù)調(diào)用它一樣。
Ø 對(duì)于大多數(shù)其它的數(shù)據(jù)類型,在調(diào)用send()方法之前,應(yīng)該使用setRequestHeader()方法先設(shè)置Content-Type頭部。
Ø 可選參數(shù)可以是DOM 對(duì)象的實(shí)例、輸入流,或者串。
Ø 傳入這個(gè)方法的內(nèi)容會(huì)作為請(qǐng)求體的一部分發(fā)送。
XMLHttpRequest對(duì)象的setRequestHeader()方法
Ø setRequestHeader(DOMString header,DOMString value)方法用來設(shè)置請(qǐng)求的頭部信息。
Ø 當(dāng)readyState值為1時(shí),你可以在調(diào)用open()方法后調(diào)用這個(gè)方法。否則,你將得到一個(gè)異常。
Ø getResponseHeader(DOMString header,value)方法用于檢索響應(yīng)的頭部值。
Ø 僅當(dāng)readyState值是3或4(換句話說,在響應(yīng)頭部可用以后)時(shí),才可以調(diào)用這個(gè)方法。否則,該方法返回一個(gè)空字符串。
XMLHttpRequest對(duì)象的getAllResponseHeaders()方法
Ø 該getAllResponseHeaders()方法以一個(gè)字符串形式返回所有的響應(yīng)頭部(每一個(gè)頭部占單獨(dú)的一行)。
Ø 如果readyState的值不是3或4,則該方法返回null。
作者:周大慶(zhoudaqing)
網(wǎng)址:http://www.aygfsteel.com/yifeng
>>>轉(zhuǎn)載請(qǐng)注明出處!<<<