1.建立Ajax物件
var xhr=new XMLHttpRequest();
2.告訴Ajax請求地址以及請求方式
xhr.open('get','http://www.example.com'); //get或者request地址
3.傳送請求
xhr.send();
4.獲取伺服器端與客戶端的相應資料
xhr.onload=function(){console.log(xhr.responseText)}
5.JSON.parse(); //將Json字串轉換為Json物件
6.get請求方式
xhr.open('get'，'http://www.aidneg.com')
7.POST請求方式
xhr.setRequestHeader('Content-Type'，'application/x-www-form-urlencoded')//設定請求引數的型別
xhr.send('name=zhangsan&age=20')//傳送請求
7.1請求引數的格式：
1.application/x-www-form-urlencoded
2.application/json //{name:'zhangsan',age:'20'}
在請求中指定Content-Type屬性值為application/json,告訴伺服器端當前請求引數的格式是Json;
JSON.stringify();//將Json物件轉換為json字串
8.Ajax狀態碼
在建立ajax物件，配置ajax物件，傳送請求，以及接受完服務端響應資料，這個過程中的每一個步驟都會對應一個數值，這個數值就是ajax狀態碼
0：請求未初始化(還沒有呼叫open())
1:請求已經簡歷，但是還沒有傳送
2：請求已經傳送
3:請求正在處理，通常相應中已經有部分資料
4:響應已經完成
xhr.readyState //獲取Ajax狀態碼
獲取伺服器端的響應
onreadystatechange 事件 當Ajax狀態碼發生變化時將自動觸發該事件。
xhr.onreadystatechange=function(){
console.log(xhr.readyState);
if(xhr.readState ==4){
console.log(xhr.resonseText);
}
}
9.Ajax錯誤處理
1.網路暢通，伺服器能接收到請求，伺服器端返回的結果不是預期結果。透過xhr.status獲取http狀態碼
2.當網路中斷時會觸發onerr事件
10.Ajax封裝
問題：傳送一次請求程式碼過多，傳送多次請求程式碼冗餘且重複
解決方案:將請求程式碼封裝到函式中，發請求時呼叫函式即可。
11.
xhr.getResponseHeader('Content-Type') //獲取響應頭中的資料
responseText =JSON.parse(responseText) //將json字串轉化為json物件
12. 採用模板引擎
1.將模板引擎的庫檔案引入到當前頁面
2.準備art-template模板