1. 程式人生 > >Ajax與Comet-JavaScript高級程序設計第21章讀書筆記(1)

Ajax與Comet-JavaScript高級程序設計第21章讀書筆記(1)

set activex .html 規範 sta php 協議 num 刷新

Ajax(Asynchronous Javascript + XML)技術的核心是XMLHttpRequest對象,即: XHR。雖然名字中包含XML,但它所指的僅僅是這種無須刷新頁面即可從服務器端獲取數據的技術,其通信與數據格式無關,並不一定是XML數據。

XMLHttpRequest對象

IE7+、Firefox、Opera、Chrome 和 Safari 都支持原生的XHR對象。我們可以直接使用XMLHttpRequest構造函數來創建XHR對象。

var xhr = new XMLHttpRequest();

雖然,IE7之前版本的瀏覽器中,創建xhr的方法與此有所不同,但是,前端技術發展到今天,已經很少有業務需求是要支持IE7之前的版本了。因此,這裏我略過這一情況。

XHR的用法

使用 XHR對象的時候,要調用的第一個方法是open(),它接受3個參數:

  1. 要發送請求的類型,如: get/post
  2. 請求的url
  3. 是否異步發送請求,這個參數是一個布爾值

xhr.open(‘get‘, ‘example.php‘, false)

註意:open()方法的調用並不會真正發送請求,僅僅是啟動一個請求以備發送!

另外,只能向同一個域中使用相同端口和協議的URL發送請求,否則,會出現錯誤。

在執行open()方法之後,必須再調用send()方法,才會真正發起ajax請求。

xhr.open(‘get‘, ‘example.txt‘, false);
xhr.send(null);

send()方法接收一個參數,即:要作為請求主體發送的數據。如果不需要發送數據,那麽必須傳入null,因為該參數對於部分瀏覽器而言是必需的。

本例中的請求是同步的,Javascript代碼會等到服務器響應之後再執行。
收到響應後,響應的數據會自動填充XHR對象的屬性,相關的屬性有:

  1. responseText: 作為響應主體被返回的文本。
  2. responseXML: 如果響應的內容類型是"text/xml"或者"application/xml",那麽這個屬性中將保存著包含響應數據的XML DOM文檔。
  3. status: 響應的HTTP狀態
  4. statusText: HTTP狀態的說明

無論內容類型是什麽,響應主體的內容都會保存到responseText

屬性中,而對於非XML數據而言,responseXML 屬性的值將會是null

收到響應後,一般來說,會先判斷 status 是否為200,這是此次請求成功的標誌。此時,responseText屬性的內容已經就緒,而且在內容類型正確的情況下,responseXML也能夠訪問了。
另外,狀態碼status如果是304,那麽表示請求的資源沒有被修改,可以直接使用瀏覽器中的緩存,當然,這樣的響應也是有效的。

if( (xhr.status >= 200 && xhr.status < 300) || xhr.status == 304 ){
    alert(xhr.responseText);
}
else{
    alert(‘fail! status:‘ + xhr.status);
}

有的瀏覽器會錯誤地報告 204 的狀態代碼。IE中 XHR 的ActiveX版本會將204設置為1223,而IE中原生的 XHR 則會將 204 規範化為 200。Opera會在取得204時報告 status的值為0。

原文鏈接:http://www.4455q.com/ajax-comet-javascript-chapter21-note1.html

Ajax與Comet-JavaScript高級程序設計第21章讀書筆記(1)