1、全域重繪和區域重繪：
1）全域重繪：整個瀏覽器被新的資料覆寫，在網路中傳輸大量的資料（瀏覽器需要加載，渲染頁面），
2）區域重繪：在瀏覽器的內部，發起請求，獲取資料，改變頁面中的部分內容，其余的頁面無需加載和渲染（網路中資料傳輸量少， 給用戶的感受好），
ajax 是用來做區域重繪的，區域重繪使用的核心物件是【異步物件（XMLHttpRequest）】，這個異步物件存在瀏覽器記憶體中 ，使用 javascript 語法創建和使用，
2、Asynchronous JavaScript and XML：
ajax ---> Asynchronous JavaScript and XML（異步的 JavaScript 和 XML）:
- xml 是網路中的一種傳輸的資料格式（json 替換了 xml）
1）ajax 是一種做區域重繪的新方法，不是一種語言，ajax包含的技術主要有 javascript , dom , css , xml 等等（核心是 javascript 和 xml），
2）javascript 負責創建異步物件， 發送請求， 更新頁面的 dom 物件，ajax 請求需要服務器端的資料，
3、ajax 中使用 XMLHttpRequest 物件（四步）：
1）創建異步物件（第一步）：
var xmlHttp = new XMLHttpRequest();
2）給異步物件系結事件（第二步）：
xmlHttp.onreadystatechange //當異步物件發起請求，獲取了資料都會觸發這個事件,這個事件需要指定一個函式,在函式中處理狀態的變化如何獲取服務器端回傳的資料？
- 使用異步物件的屬性 responseText // xmlHttp . responseText
當請求的狀態變化時，異步物件會自動呼叫 onreadystatechange 事件對應的函式（回呼：當請求的狀態變化時，異步物件會自動呼叫 onreadystatechange 事件對應的函式）
栗子：
xmlHttp.onreadystatechange= function(){
//處理請求的狀態變化
if(xmlHttp.readyState == 4 && xmlHttp.status== 200 ){
//可以處理服務器端的資料，更新當前頁面
var data = https://www.cnblogs.com/Burning-youth/p/xmlHttp.responseText;
document.getElementById("name").value= https://www.cnblogs.com/Burning-youth/p/data;
}
}
readyState（異步物件的屬性） --- 異步物件請求的狀態變化：
- 0：創建異步物件時 //new XMLHttpRequest ( ) ;
- 1：初始異步請求物件 //xmlHttp.open ( ) ;
- 2：發送請求 //xmlHttp.send ( ) ;
- 3：從服務器端獲取了資料，注意3是異步物件內部使用， 獲取了原始的資料
- 4：異步物件把接收的資料處理完成后，此時開發人員在4的時候處理資料（更新當前頁面）
異步物件的 status 屬性，表示網路請求的狀況（200， 404， 500），當 status == 200 時，表示網路請求成功，
3）初始異步請求物件（第三步）：
異步的方法：
- open ( ) . xmlHttp . open ( get / post , "服務器端的訪問地址" , true / false ) // true 為異步請求，false 為同步請求 ，默認為 true
- 異步請求特點：
1)某一個時刻，瀏覽器可以委托多個異步請求物件發送請求，無需等待請求處理完成；
2)瀏覽器委托異步請求物件作業期間，瀏覽器處于活躍狀態，可以繼續向下執行其他命令；
3) 當回應就緒后再對回應結果進行處理 ，
- 同步請求特點：
1)某一個時刻，瀏覽器只能委托一個異步請求物件發送請求，必須等待請求處理完成；
2)瀏覽器委托異步請求物件作業期間，瀏覽器處于等待狀態，不能執行其他命令；
3)不推薦使用，
栗子：
xmlHttp.open("get", "loginServlet?name=zs&pwd=123",true);
4）使用異步物件發送請求（第四步）：
xmlHttp.send();
4、json使用：
ajax（發起請求）---> servlet ---> 回傳一個 json 格式的字串（可以將 json 物件格式看作成一個 "key:value"格式） // { name:"河北", jiancheng:"冀","shenghui":"石家莊"}
json分類：
- json物件 ，JSONObject
- json陣列， JSONArray // [ { name:"河北", jiancheng:"冀","shenghui":"石家莊"} , { name:"山西", jiancheng:"晉","shenghui":"太原" } ]
為什么要使用 json？
- json 格式好理解
- json 格式資料在多種語言中，比較容易處理， 使用 java， javascript 讀寫 json 格式的資料比較容易
- json 格式資料它占用的空間小，在網路中傳輸快， 用戶的體驗好
處理 json 的工具庫： gson（google）； fastjson（阿里），jackson， json-lib
- 在 js 中，可以把 json 格式的字串，轉為 json 物件， json 中的 key，就是 json 物件的屬性名，
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/448069.html
標籤：Java