1.什麼是Ajax？
Ajax技術是使瀏覽器可以爲用戶提供更爲自然的瀏覽體驗
2.Ajax核心
Ajax的核心是JavaScript對象XmlHttpRequest。
該對象在Internet Explorer 5中首次引入，它是一種支持異步請求的技術。簡而言之，XmlHttpRequest使用戶可以使用JavaScript向服務器提出請求並處理響應，而不阻塞用戶。
特點：無刷新局部更新數據，至2016年，各大網站幾乎都有使用。
3.Ajax的優勢與缺點
優勢：迅捷的反應速度
a.不需要插件支持
b.優秀的用戶體驗
c.提高Web程序性能
d.減輕服務器負擔
缺點：
a.XmlHttpRequest對象瀏覽器支持不足，早些年只有IE瀏覽器支持（現已解決）
b.破壞 瀏覽器的“前進”、“後退”按鈕的正常功能（現已解決）
c.對瀏覽器搜索引擎支持不足，無法搜索關鍵字（仍未解決）
d.開發和調試工具缺乏（仍未解決）webstorm可以
4.Ajax的應用
jQuery對Ajax進行了封裝，可用其方法
a.底層方法：$.ajax() 一般用這種方法，直觀快捷，二三層方法都是基於底層方法，需要調用底層方法
語法：$.ajax(options)
options是key/value形式，均爲可選
示例：
$("#send").click(function(){
$.ajax({
type:"get", //提交方式
url:"test.asp", //地址
success:function(){} //執行成功的回調函數
...... //可以寫執行失敗的回調函數
});
});
b.第二層方法：load() 、$.get()、$.post() get和post方法只有提交方式不同，其餘一樣，默認get方法
load()方法 將遠程頁面的響應代碼插入DOM中
語法：load(url,[data],[callback])
url : 請求頁面的地址
data(可選): 發送到服務器的key/value數據
callback(可選)： 請求完成時的回調函數(無論請求成功或者請求失敗)
注意：無參data時以get方式提交，有參data時以post方式提交
示例：
$(function(){
$("#send").click(function(){
$("#resTex").load("test.html");
});
});
$(function(){
$("#send").click(function(){
$("#resTex").load("test.html",{name:"xxx",age:"21"},)
function(responseText,textStatus,XMLHttprequest){
alert(responseText); //請求訪問的內容
alert(textStatus); //請求的狀態(成功或失敗)
alert(XMLHttprequest); //XMLHttprequest對象
};
});
});
$.get( ) 方法和 $.post( ) 方法
語法：
$.get( url [, data] [,callback] [, type] )
$.post( url [, data] [, callback] [, type] )
url：請求頁面的 url
data（可選）：發送到服務器的 key/value數據
callback（可選）：請求完成時的回調函數（只有成功才被調用）
type（可選）：返回內容的格式（text, html, xml, script, json）
示例;
$("#send").click(function(){ //$.get()方法
$.get("AjaxHandler.ashx",
{name: "張三", age:"21"},
function (data, status) {
$("#div").html(data);
});
});
//$.post()方法
$("#send").click(function(){
$.post("AjaxHandler.ashx",
{name: "張三", age:"21"},
function (data, status) {
$("#div").html(data);
});
});
c.第三層方法：$.getScript()、$getJSON()
$.getScript( ) 與 $.getJSON( ) 方法
$.getScript( )：動態引入JS文件
語法：
$.getScript( JS文件的url ,[callback] )
$.getJSON( )：加載JSON文件
語法：
$.getJSON( JSON文件url ,[callback] )
5.具體使用步驟
//1.創建XMLHttpRequest對象
var xhr = new XMLHttpRequest();
//2.初始化XMLHttpRequest xhr.open("post","data/data1.txt",true); true表示異步請求
//3.設置回調函數
xhr.onreadystatechange = function(){
//readyState的值：0-未初始化，1-已初始化，2-已發送請求，還未接到響應，3-接到服務器響應數據，未完成，4-數據接收完成
//HTTP響應狀態碼：2xx : 成功，3xx : 請求需要進一步細化，4xx : 客戶端錯誤，5xx : 服務器錯誤
if(xhr.readyState==4 && xhr.status==200){
document.getElementById("d1").innerHTML = xhr.responseText;
}
};
//4.發送請求 xhr.send(null);
這裏順便推薦一個高質量的java公衆號，趕緊關注領取免費資料吧！
