一、Ajax
Ajax = 異步JavaScript和XML，Ajax是一種用于建立快速動态網頁的技術。
通過在背景與伺服器進行少量資料交換，Ajax可以使網頁實作異步更新。可以再網頁不重新加載的情況下，對網頁的某部分進行更新。
傳統網頁（不使用Ajax）如果需要更新内容，必須重新加載整個網頁。
注意：Ajax 不是一種新的程式設計語言，而是一種用于建立更好更快以及互動性更強的 web 應用程式技術。
二、Ajax所包含的技術
① 使用CSS和XHTML來表示
② 使用DOM模型來互動和動态顯示
③ 使用XMLHttpRequest來和伺服器進行異步通信
④ 使用JavaScript來綁定和調用
AJAX核心是XMLHTTPRequest對象，不同的浏覽器建立XMLHTTPRequest對象方法是有差異的。
IE使用ActiveXObject，而其它的浏覽器使用XMLHTTPRequest的JavaScript内建對象；
三、XMLHTTPRequest對象屬性
1）onreadystatechange：狀态改變的事件觸發器，每個狀态改變時都會觸發這個事件處理器，通常會調用一個JavaScript函數
2）readySteat：請求的狀态(0-1-2-3-4)
0 - （未初始化）還沒有調用send()方法
1 - （載入）已調用send()方法，正在發送請求
2 - （載入完成）send()方法執行完成，已接收到全部響應内容
3 - （互動）正在解析響應内容
4 - （完成）響應内容解析完成，可以在用戶端調用
3）responseText：伺服器的響應，傳回資料的文本（内容）
4）responseXML：伺服器的響應，傳回資料的相容DOM的XML文檔對象，這個對象可以解析為一個DOM對象
5）responseBody：伺服器傳回的主題（非文本格式）
6）responseStream：伺服器傳回的資料流
7）status：伺服器的HTTP狀态碼（如：404="檔案未找到"、200="成功"，等等）
8）statusText：伺服器傳回的狀态文本資訊，HTTP狀态碼的相應文本（OK或Not Found(未找到) 等等）
四、XMLHttpRequset對象方法
1）abort()：停止目前請求
2）getAllResponseHeaders()：把HTTP請求的所有響應首部作為鍵/值對傳回
3）getResponseHeaders("header")：傳回指定首部的串值
4）open(method,url,asyncFlag)：初始化一個請求，建立對伺服器的調用；xmlHttp.open("GET","test.jsp",true)
參數 method：設定請求類型(GET或POST)。
參數 url：檔案在伺服器上的位置。
參數 asyncFlag：是否異步處理請求。
5）send(content)：向伺服器發送請求
6）setRequestHeaders("header","value")：把指定首部設定為所提供的值。在設定任何首部之前必須先調用open()。設定header并和請求一起發送('post')方法一定要
五、Ajax使用步驟
① 建立XMLHttpRequest對象
② 設定請求方式
③ 調用回調函數
④ 發送請求
六、XMLHttpRequest寫法
//建立XMLHttpRequest對象
var xmlHttp ;
if(window.XMLHttpRequest){ //非IE
xmlHttp = = new XMLHttpRequest();
}else if(window.ActiveXObject){ //IE
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
//設定請求方式
xmlHttpxhr.open('POST', '/hello.json', true)
//發送. psot資料要放在send裡面
xmlHttp.send('username=luoshushu&passwore=123')
xmlHttp.addEventListener('load', function () {
if((xmlHttp.status >= 200 && xmlHttp.status < 300) || xmlHttp.status === 304){
var data = xmlHttp.responseText
console.log(data)
}else{
console.log('出錯了')
}
}) 七、ajax标準寫法
$.ajax({
url:"http://www.microsoft.com", //請求的url位址
dataType:"json", //傳回格式為json
async:true,//請求是否異步，預設為異步，這也是ajax重要特性
data:{"id":"value"}, //參數值
type:"POST", //請求方式
beforeSend:function(){
//請求前的處理
},
success:function(req){
//請求成功時處理
},
complete:function(){
//請求完成的處理
},
error:function(){
//請求出錯處理
}
});