AJAX5步法
1、建立異步對象XMLHttpRequest
2、設定回調函數
3、open()方法連接配接伺服器
4.send()方法發送資料至伺服器
5、回調函數中針對不同響應狀态進行處理，局部更新界面
完整代碼如下所示
接下來測試下get請求類型，将open連接配接伺服器步驟裡的請求類型設定為get，如下所示
利用HBuilder編輯器打開(啟動時自帶本地伺服器)如下所示
接下來轉換JSON資料為普通JS對象型，如下所示
AJAX封裝
目前為止，已經實作基本功能，但AJAX的調用還十分麻煩，步驟比較繁瑣，在日常開發一般會将其進行封裝，是以接下來封裝下AJAX功能相關步驟函數，以後使用直接調用即可，同時大大提高了開發效率。
為了使用友善，接下來封裝AJAX的get和post
封裝：基本模闆與傳參
此時調用模闆時，如下所示
封裝1：建立異步對象
封裝2：判斷請求類型
封裝2：判斷請求類型
get請求類型傳值方式是将資料拼接到路由後進行傳值，是以接下來需要判斷是否傳值(對比post請求)，回顧之前所講
1、get請求類型傳值方式是将資料拼接到路由後進行傳值
2、post請求類型判斷是否有傳值，如果有則send發送至伺服器，沒有則不發
封裝3：注冊事件，針對不同狀态進行響應，擷取傳回資料
開發中，也可以将響應，即注冊事件步驟，直接移至第一步建立異步對象下，以便更好地監聽到狀态變化。
封裝調用：
接下來外部傳參調用下封裝的AJAX函數
此時控制台測試，便可以輸出列印JSON格式資料，是以如果想用JS進一步操作，需要進行反序列化解析即JSON.parse()，然後操作其對頁面進行局部更新。
AJAX跨域
跨域簡介：
AJAX跨域指的是JS在不同的域之間進行資料傳輸或通信。
跨域方案：
1、jsonp跨域(重點)----前端處理方法
2、cros跨域-----背景處理
常見跨域場景？
所謂的同源是指，域名、協定、端口均為相同。
http://www.nealyang.cn/index.html 調用 http://www.nealyang.cn/server.php 非跨域
http://www.nealyang.cn/index.html 調用 http://www.neal.cn/server.php 跨域,主域不同
http://abc.nealyang.cn/index.html 調用 http://abc.neal.cn/server.php 跨域,子域名不同
http://www.nealyang.cn:8080/index.html 調用 http://www.nealyang.cn/server.php 跨域,端口不同
https://www.nealyang.cn/index.html 調用 http://www.nealyang.cn/server.php 跨域,協定不同
localhost 調用 127.0.0.1 跨域
AJAX跨域-JSONP
JSONP跨域：
jsonp跨域原理：借助網頁标簽中src屬性的跨域特性實作
src簡介：src是source的縮寫，資源的意思，在html中src表示資源位址，是js檔案和圖檔檔案的引入方式，經常引用外部資源，可以實作跨域通路，如下所示
接下來調用下百度搜尋接口，如下所示
https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/?wd=&cb=
解析：
wd為搜尋關鍵詞，百度搜尋功能發送請求類型為get，因為所搜的關鍵詞可以在url中可見。這裡先不用回調
将之前代碼做下調整，将url改為百度搜尋接口，如下所示
注意：
因為是get方式，是以關鍵詞傳值需要拼接到url裡，即通過data傳參，且參數為想要的關鍵詞，然後之前封裝好的AJAX會将其進行封裝，也就是說最後send對應的接口url為經過封裝的AJAX函數拼接後的位址
https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/?wd=海賊王
将之前代碼做下調整，将url改為百度搜尋接口，如下所示
接下來使用JSONP實作跨域，本質利用src屬性的跨域請求資源特性，同理腳本标簽也是通過src引入資源，是以可以進行封裝處理，實作AJAX的跨域通路遠端資源。
接下來做下測試，script标簽引入接口檔案，并在接口加入回調函數，然後在頁面定義調用
測試結果如下
此時雖然有報錯，但是已經沒有報跨域錯誤，接下來将調用位置做下調整，先定義聲明函數，然後再進行傳值，如下所示
修改後測試結果如下
AJAX跨域-CROS
除了通過JSONP解決跨域外，常見的方法還包含CROS方法
【前言】
CROS需要在背景進行配置→允許所有域名通路
1、PHP背景僅僅需要添加一句代碼即可 header(’ Access-Control-Allow-Origin : * '); 表示允許所有域名通路。
2、JAVA背景需要下載下傳CROS包，然後進一步配置