原生的js寫Ajax請求

1：界面

界面就一個按鈕 和一個用來顯示伺服器傳回來的資料的div

2:js實作Ajax

注意：我這裡在建立XMLHttpRequest對象，沒有用相容性寫法。實際中，需要用相容性寫法。

7步完成  第8步，如果需要處理資料，就處理資料。

3：背景的資料是   json格式的資料 ，是一個數組。

4：效果

點選按鈕出現如下效果，并且頁面不會重新整理。

總結:

Ajax：允許浏覽器與伺服器通信不用重新整理整個頁面的一種技術，它不是一門新的技術，而是幾種技術的整合。

傳統的web模型：用戶端向伺服器發送一個請求，伺服器傳回整個頁面給用戶端，如此反複。

在Ajax模型中：資料在用戶端與伺服器之間獨立傳輸，伺服器不再傳回整個頁面給用戶端。

readyState屬性表示Ajax請求的目前狀态。它的值用數字代表。

0:還沒開始調用open方法.

1:正在加載。open方法已經被調用，但send方法還沒有被調用

2:已經加載完畢了。send方法以被調用，請求已經開始了

3:互動中。伺服器正在發送響應。

4:完成。響應發送完畢。

每次readyState屬性值的改變都會觸發readystatechange事件

在XMLHttpRequest對象中，伺服器發送的狀态碼都儲存在status屬性中。

通過把這個值和200或304比較，可以確定伺服器是否發送了一個成功的響應。

404:沒有找到頁面(not found)

403:禁止通路(forbidden)

500:内部伺服器出錯(internal service error)

200:一切正常(ok)

304:沒有被修改(not modified)

互動資料的格式可以是：html  普通的文本 json  xml

html 、json、  普通的文本 ：都是以文本類型進行傳輸

html 、json、  普通的文本類型的資料： 通過responseText屬性來擷取

xml類型的資料：                                    通過responseXML屬性來擷取