1.什麼是ajax：

非同步javascript和XML。

同步是指：傳送方發出資料後，等接收方發回響應以後才發下一個數據包的通訊方式。
非同步是指：傳送方發出資料後，不等接收方發回響應，接著傳送下個數據包的通訊方式。

無重新整理讀取資料。無需載入整個頁面的情況下，重新整理頁面某一部分。
常用的地方：使用者註冊和聊天室。

ajax基礎

var oBtn = document.getElementById('btn1');
oBtn.onclick = function(){
//ajax能且僅能從伺服器上讀取檔案資訊
    ajax('aaa.txt',function
 
(str){alert(str);});
}

有一個aaa.txt的檔案，內容為“大家好”，則通過ajax的讀取，能在瀏覽器中顯示出txt的內容。

==注意==：儲存的txt檔案也必須是utf-8編碼，否則不是亂碼就是出錯

請求並顯示靜態txt檔案

字符集編碼：utf-8編碼
快取、阻止快取，利用url中的‘abc.txt?t=’+new Data().getTime()（毫秒數）

for(var i=0;i<aBtn.length;i++){
    aBtn[i].index = i;
    aBtn[i].onclick = function(){
        ajax((this
 
.index+1)+".txt?t="+new Date().getTime(),function(str){
            oDiv.innerHTML = str;
        })
    }
}

有三個檔案，分別為1.txt：資料一；2.txt：資料二；3.txt：資料三；
通過上述資料則可以在點選相應按鈕時顯示相應txt文本里的內容；

動態資料：請求js（或json）檔案

在伺服器上讀到的東西全部是以文字（string）的方式，因此無法拿到陣列或者json，需要用eval。
eval(str)的使用：講字串轉換成js程式碼。
伺服器上更多的是放的json或由json組成的陣列。

ajax請求的步驟

1.建立XMLHttpRequest

不同瀏覽器使用的非同步呼叫物件也有所不同，在IE瀏覽器中非同步呼叫使用的是XMLHTTP元件中的XMLHttpRequest物件，而在Firefox瀏覽器中則直接使用XMLHttpRequest元件。

    var xmlHttp = null;
    if(window.XMLHttpRequest){
        xmlHttp = new XMLHttpRequest();//ie6及以下不相容，針對主流瀏覽器
    }else{                             // 針對ie5, ie6
        xmlHttp = new ActiveXObject("Microsoft,XMLHTTP");
    }

2.連線伺服器

    xmlHttp.open('GET',url,true);  //xmlhttp.open(method,url,async)

method 包含 get 和 post兩種方法
url主要是檔案或資源的路徑，async引數為true(代表非同步)或者false（代表同步）

get和post的區別：
（1）是有那個get請求時，引數在url中顯示，而使用post方式，則不會顯示出來。
（2）使用get請求傳送資料量小，post請求傳送資料量大
（3）get請求需注意快取問題，post請求不需要擔心這個問題。

與 POST 相比，GET 更簡單也更快，並且在大部分情況下都能用。
然而，在以下情況中，請使用 POST 請求：
1.無法使用快取檔案（更新伺服器上的檔案或資料庫）
2.向伺服器傳送大量資料（POST 沒有資料量限制）
3.傳送包含未知字元的使用者輸入時，POST 比 GET 更穩定也更可靠

3.向伺服器端傳送請求

    xmlHttp.send();

4.接受伺服器的返回

    xmlHttp.onreadystatechange = function(){
        if(xmlHttp.readyState == 4){   //判斷互動是否成功
            if(xmlHttp.status == 200){    //獲取伺服器返回的資料   獲取純文字資料
                //alert('成功：'+xmlHttp.responseText);
                fnSucc(xmlHttp.responseText);
            }else{
                //alert('失敗');
                if(fnFaild){
                    fnFaild();
                }
            }
        }
    }

總的程式碼如下：

function ajax(url,fnSucc,fnFaild){
    // 引數;1.連線伺服器的地址 2.成功時函式 3，失敗時函式
    // 1. 建立xmlhttprequest物件
    var xmlHttp = null;
    if(window.XMLHttpRequest){
        xmlHttp = new XMLHttpRequest();//ie6及以下不相容，針對主流瀏覽器
    }else{                             // 針對ie5, ie6
        xmlHttp = new ActiveXObject("Microsoft,XMLHTTP");
    }
    //2. 連線伺服器
    xmlHttp.open('GET',url,true);  //xmlhttp.open(method,url,async)
    // method 包含 get 和 post兩種方法 url主要是檔案或資源的路徑，async引數為true(代表非同步)或者false（代表同步）
    //3.向伺服器端傳送請求
    xmlHttp.send();
    //4.接受伺服器的返回
    xmlHttp.onreadystatechange = function(){
        if(xmlHttp.readyState == 4){   // 判斷互動是否成功
            if(xmlHttp.status == 200){      //獲取伺服器返回的資料  獲取純文字資料
                //alert('成功：'+xmlHttp.responseText);
                fnSucc(xmlHttp.responseText);
            }else{
                //alert('失敗');
                if(fnFaild){
                    fnFaild();
                }
            }
        }
    }
}

XMLHttpRequest取得相應
- responseText:獲得字串形式的響應資料
- responseXML：獲得xml形式的響應資料
- status和statusText：以數字和文字形勢返回http轉態碼
- getAllResponseHeader():獲得所有的相應
- getResponseHeader()：查詢相應中的某個欄位的值
- readState屬性

readystate的五種返回值所代表的意義：
- 0（未初始化） 還沒呼叫open（）方法
- 1（載入）已經呼叫send方法(),正在傳送請求
- 2（載入完成）send（）方法已經完成，已收到相應
- 3（解析）正在解析響應內容
- 4（完成）相應內容解析完成，可在客戶端呼叫。

ajax中status幾種常態說明：
- 100——客戶必須繼續發出請求
- 101——客戶要求伺服器根據請求轉換HTTP協議版本
- 200——成功
- 201——提示知道新檔案的URL
- 300——請求的資源可在多處得到
- 301——刪除請求資料
- 404——沒有發現檔案、查詢或URl
- 500——伺服器產生內部錯