一、Ajax簡介
Ajax 即“Asynchronous Javascript And XML”（非同步 JavaScript 和 XML），是指一種建立 互動式、快速動態應用的網頁開發技術，無需重新載入整個網頁的情況下，能夠更新頁面區域性資料的技術。
透過在後臺與伺服器進行少量資料交換，Ajax 可以使頁面實現非同步更新。這意味著可 以在不重新載入整個頁面的情況下，對頁面的某部分進行更新。
二、Ajax的使用
1.XMLHttpRequest物件
XMLHttpRequest 是瀏覽器介面物件，該物件的 API 可被 JavaScript、VBScript 以及其它 web 瀏覽器內嵌的指令碼語言呼叫，透過 HTTP 協議在瀏覽器和 web 伺服器之間收發 XML 或其它資料。XMLHttpRequest 可以與伺服器實現非同步互動，而無需讓整個頁面重新整理，因此成為 Ajax 程式設計的核心物件。
2.Ajax的使用步驟
1建立 XMLHttpRequest 物件
var xhr = new XMLHttpRequest（）；
2給定請求方式以及請求地址
xhr。open（“get”，“http：//www。example。com”）；
3傳送請求
xhr。send（）；
4獲取伺服器端給客戶端的響應資料
示例：
3.Ajax的執行原理
三、JSON詳解
JSON簡介
JSON（JavaScript Object Notation） 是一種基於字串的輕量級的資料交換格式。易於人閱讀和編寫，同時也易於機器解析和生成。
JSON 是 JavaScript 資料型別的子集
。
2.為什麼要使用JSON
在 JSON 未出現之前在 Ajax 中對於資料傳遞方式，會使用 XML 作為主要資料格式來傳 輸資料。直到 JSON 出現後逐漸放棄使用 XML 作為資料傳輸格式。JSON 比 XML 更小、更快、更易解析。
3.JSON格式的特徵
JSON的語法規則：
JSON 是按照特定的語法規則所生成的字串結構。
大括號表示 JSON 的字串物件。{ }
屬性和值用冒號分割。{“屬性”：“value”}，如果value是數字，則不用加雙引號。
屬性和屬性之間用逗號分割。{“屬性”：“value”，“屬性”：“value”，。。。}
中括號表示陣列。［{“屬性”：“value”。。。}，{“屬性”：“value”。。。}］
JSON字串物件：
{“userid”：1，“username”：“admin”，“sex”：“male”}
陣列：
［{“userid”：1，“username”：“admin”}，{“userid”：2，“username”：“oldlu”}］
J
SON的6種資料型別：
string：字串，必須要用雙引號引起來。
number：數值，與 JavaScript 的 number 一致，
object：JavaScript 的物件形式，{ key：value }表示方式，可巢狀。
array：陣列，JavaScript 的 Array 表示方式［ value ］，可巢狀。
true/false：布林型別，JavaScript 的 boolean 型別。
null：空值，JavaScript 的 null。
4.Jackson的使用
在 JDK 中並沒有內建操作 JSON 格式資料的 API，因此使用處理 JSON 格式的資料需要藉助第三方類庫。
幾個常用的 JSON 解析類庫：
Gson： 谷歌開發的 JSON 庫，功能十分全面。
FastJson： 阿里巴巴開發的 JSON 庫，效能十分優秀。
Jackson： 社群十分活躍且更新速度很快。被稱為“最好的 Json 解析器”。
4.1Jackson簡介：
Jackson 是一種解析 JSON 格式資料的 API，也是最流行，速度最快的 JSON API。在 SpringMVC 中預設使用 Jackson API 處理 JSON 格式的資料。
Jackson 下載地址：
4.2在響應中透過JSON格式傳遞資料
：
在響應中使用 Jackson 處理 JSON 格式資料的步驟：
新增 jackson-annotations。jar、jackson-core。jar、jackson-databind。jar
透過 jackson API 將 Java 物件轉換 JSON 格式
修改響應頭，響應型別為 application/json
將結果基於字元輸出流推回客戶端瀏覽器
在頁面的中透過 JavaScript 的 JSON。parse（）函式將 JSON 格式的資料轉換為 JavaScript物件
透過JSON格式在響應中傳遞單個物件
：
需求：定義一個 Users 類，包含 userid、username 屬性。
例項化一個 Users 物件，透過 JSON 格式將 Users 物件響應到客戶端瀏覽器。
將 Users 物件中的資料插入到頁面中。
00：09
透過JSON格式在響應中傳遞多個物件
：
需求：定義一個 Users 類，包含 userid、username 屬性。
例項化多個 Users 物件，透過 JSON 格式將 Users 物件響應到客戶端瀏覽器。
將 Users 物件中的資料插入到頁面中。
00：09
在JSON中透過Map傳遞資料
：在 JSON 格式中可以直接使用 Map 作為傳遞資料的模型。因為 Map 結構本身就是 key 與 value 的結構與 JSON 格式物件模型完全匹配，所以我們可以直接將一個 Map 物件轉換為 JSON 格式的字串物件。這對於我們來說是一件非常方便的事情，如果我們返回的資料並 沒有對應的模型來存放資料，那麼我們可以透過 Map 來解決。
00：09
4.3在請求中透過JSON格式傳遞資料
：我們除了可以在響應中透過 JSON 格式來傳遞資料以外，在請求中也可以使用 JSON 格 式傳遞資料。如果在請求中使用 JSON 格式傳遞資料，那麼提交方式需要使用
POST
方式，透過 JavaScript 中的 JSON。stringify（）函式將 JavaScript 物件轉換為 JSON 格式資料。透過 send 方法將引數傳遞到 Servlet 中，在 Servlet 中透過字元輸入流獲取 JSON 格式資料。
在請求中使用 Jackson 處理 JSON 格式資料的步驟：
新增 jackson-annotations。jar、jackson-core。jar、jackson-databind。jar
在頁面的 JavaScript 中透過 JSON。stringify（）函式將 JavaScript 物件轉換為 JSON 格式的資料
將請求方式修改為 POST 方式
透過 send（）函式將 JSON 格式的資料提交到服務端。
在 Servlet 中透過字元輸入流讀取請求體中 JSON 格式的資料
透過 jackson API 將獲取到的 JSON 格式的資料轉換為 Java 物件
00：18
4.4Jackson的常用註解：
@JsonProperty
此註解用於屬性上，作用是把該屬性的名稱序列化為另外一個名稱，如把 username 屬性序列化為 name，@JsonProperty（“name”）。
@JsonIgnore
此註解用於屬性或者方法上（一般都是定義在屬性上），用來完全忽略被註解的欄位和 方法對應的屬性，返回的 json 資料即不包含該屬性。
@JsonFormat
此註解用於屬性或者方法上（一般都是定義在屬性上），可以方便的把 Date 型別屬性的值直接轉化為我們想要的樣式。如：@JsonFormat（pattern=“yyyy-MM-dd hh：mm：ss”）
4.5Jackson工具類的使用
四、Jquery的Ajax使用
在 JQuery 中提供了對 Ajax 的封裝，讓我們在使用 Ajax 技術時變得更加容易。在 JQuery 中提供了很多的基於 Ajax 傳送非同步請求的方法，如：$。ajax（）、$。get（）、$。post（）、$。getJSON（）。
1.$.ajax()的使用（需要新增jQuery.js檔案）
語法結構：$.ajax({name:value,name:value......})
測試：
需要新增jquery。js檔案，由於jquery。js是靜態檔案，需要放到web目錄下或者web的子目錄下，為了結構清晰，我在web下新建了一個目錄js，把jquery。js放在裡面。
$.ajax()在非同步請求中提交資料
在$。ajax（）方法中透過 data 屬性來存放提交的資料，支援 JSON 格式的資料。
提交普通格式資料
在 data 屬 性 中 我 們 可 以 通 過 兩 種 方 式 來 指 定 需 要 提 交 的 數 據 。 一 種 是 通 過 name=value&name=value 的結構。另一種是透過 JavaScript 物件來指定提交資料。無論使用哪種方式在 Servlet 中都是透過 request。getParameter 方法根據 name 獲取 value 的。
透過標準格式指定提交資料
data：”name=value&name=value。。。。。” 在 Servlet 中透過 request。getParameter 來獲取提交的資料。
透過 JavaScript 物件指定提交資料
data：{userid：100， username：”oldlu” }在 Servlet 中透過 request。getParameter 來獲取提交的資料。
提交 JSON 格式資料
在$。ajax（）中提交 JSON 格式的資料需要使用
post
方式提交，透過 JSON。stringify（）函式將 JavaScript 物件轉換成 JSON 格式的字串。在 Servlet 中透過字元輸入獲取提交的 JSON 格式的資料。
data：JSON。stringify（{name：value，name：value……}）
在 Servlet 中透過 req。getReader（）。readLine（）來獲取提交的資料。
$.ajax()處理響應中的 JSON 格式資料
$。ajax（）方法會根據 dataType 屬性中的值自動對響應的資料做型別處理。如果響應的是 一個 JSON 格式的資料，那麼 dataType 的值為“JSON”，在回撥函式中我們得到的直接就是JSON 字串轉換完的 JavaScript 物件。不需要在使用 JSON。parse（）做格式的轉換處理。
2.$.get()的使用
$。get（）方法是$。ajax（）方法基於 get 方式傳送非同步請求的簡化版。
語法結構
$。get（url，function（result））
$。get（url，data，function（result））
透過標準格式指定提交資料
$。get（url，”name=value&name=value”，function（result））
透過 JavaScript 物件指定提交資料
$。get（url，{userid：1，username：”oldlu”，……}，function（result））
3. $.post()的使用
$。post（）方法是$。ajax（）方法基於 post 方式傳送非同步請求的簡化版。
語法結構
$。post（url，function（result））
$。post（url，data，function（result））
透過標準格式指定提交資料
$。post（url，”name=value&name=value”，function（result））
透過 JavaScript 物件指定提交資料
$。post（url，{userid：1，username：”oldlu”，……}，function（result））
4. $.getJSON()的使用
$。getJSON（）方法是$。ajax（）方法基於 get 方式傳送非同步請求，並將響應結果中 JSON 格式的字串物件自動轉換為 JavaScript 物件。在使用該方法時要求返回的資料必須是 JSON 格 式型別。
$。getJSON（）方法和 resp。setContentType（“application/json”）是一起使用的。
語法結構
$。getJSON（url，function（result））
$。getJSON（url，data，function（result））
透過標準格式指定提交資料
$。getJSON（url，”name=value&name=value”，function（result））
要求返回的資料格式必須是 JSON 格式。
透過 JavaScript 物件指定提交資料
$。getJSON（url，{userid：1，username：”oldlu”，……}，function（result））
要求返回的資料格式必須是 JSON 格式。
5. serialize()方法的使用
將 form 表單中的資料自動拼接成 name=value&name=value 結構。
語法結構
var param = $（“form”）。serialize（）；
param 的值為：name=value&name=value
