Ajax(Asynchronous Javascript + XML)技術的核心是XMLHttpRequest對象
,即: XHR
。雖然名字中包含XML,但它所指的僅僅是這種無須刷新頁面便可從服務器端獲取數據的技術,其通訊與數據格式無關,並不必定是XML數據。javascript
IE7+、Firefox、Opera、Chrome 和 Safari 都支持原生的XHR對象。咱們能夠直接使用XMLHttpRequest
構造函數來建立XHR對象。php
var xhr = new XMLHttpRequest();
html
雖然,IE7以前版本的瀏覽器中,建立xhr的方法與此有所不一樣,可是,前端技術發展到今天,已經不多有業務需求是要支持IE7以前的版本了。所以,這裏我略過這一狀況。前端
使用 XHR對象的時候,要調用的第一個方法是open()
,它接受3個參數:java
xhr.open('get', 'example.php', false)
ajax
注意:open()方法的調用並不會真正發送請求,僅僅是啓動一個請求以備發送!瀏覽器
另外,只能向同一個域中使用相同端口和協議的URL發送請求,不然,會出現錯誤。緩存
在執行open()
方法以後,必須再調用send()
方法,纔會真正發起ajax請求。服務器
xhr.open('get', 'example.txt', false); xhr.send(null);
send()方法接收一個參數,即:要做爲請求主體發送的數據。若是不須要發送數據,那麼必須傳入null
,由於該參數對於部分瀏覽器而言是必需的。app
本例中的請求是同步的,Javascript代碼會等到服務器響應以後再執行。
收到響應後,響應的數據會自動填充XHR對象的屬性,相關的屬性有:
不管內容類型是什麼,響應主體的內容都會保存到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