相關文章推薦：ajax影片教學
它是瀏覽器提供的一套方法，可以實現頁面無刷新更新數據，提高用戶瀏覽網站應用程式的體驗。
Ajax 的應用程式場景
頁面上拉載入更多資料
清單資料無刷新分頁
表單項目離開焦點資料驗證
搜尋框提示文字下拉清單
Ajax 運作原理
Ajax 相當於瀏覽器傳送請求與接收回應的代理人，以實現在不影響使用者瀏覽頁面的情況下，局部更新頁面數據，從而提高使用者體驗。 
Ajax 的實作步驟
var xhr = new XMLHttpRequest();
xhr.open('get', 'http://www.example.com');xhr.send();
xhr.onload = function () {
console.log(xhr.responseText);
}
# #伺服器端回應的資料格式
在真實的專案中，伺服器端大多數情況下會以JSON 物件作為回應資料的格式。當用戶端拿到回應資料時，要將 JSON 資料和 HTML 字串進行拼接，然後將拼接的結果展示在頁面中。 在 http 請求與回應的過程中，無論是請求參數還是回應內容，如果是物件類型，最終都會轉換為物件字串進行傳輸。
JSON.parse() // 将 json 字符串转换为json对象
xhr.open('get', 'http://www.example.com?name=zhangsan&age=20');POST 請求方式
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded') xhr.send('name=zhangsan&age=20');在HTTP 請求和回應的過程中傳遞的資料區塊就叫報文，包括要傳送的資料和一些附加訊息，這些資料和資訊要遵守規定好的格式。請求報文
請求參數的格式
application/x-www-form-urlencoded##
name=zhangsan&age=20&sex=男登入後複製
# application/json在請求頭中指定Content-Type 屬性的值是application/json，告訴伺服器端目前請求參數的格式是json。{name: 'zhangsan', age: '20', sex: '男'}登入後複製
JSON.stringify() // 将json对象转换为json字符串
注意：get 請求是不能提交 json 物件資料格式的，傳統網站的表單提交也是不支援 json 物件資料格式的。
取得伺服器端的回應
Ajax 狀態碼 在建立ajax對象，設定ajax對象，傳送請求，以及接收完伺服器端回應數據，這個過程中的每一個步驟都會對應一個數值，這個數值就是ajax狀態碼。 
0：請求未初始化(還沒有呼叫open()) 1：請求已經建立，但是還沒有發送(還沒有呼叫send()) 2：請求已經發送
xhr.readyState // 获取Ajax状态码
// 当Ajax状态码发生变化时
xhr.onreadystatechange = function () {
// 判断当Ajax状态码为4时
if (xhr.readyState == 4) {
// 获取服务器端的响应数据
console.log(xhr.responseText);
}
}低版本 IE 浏览器的缓存问题
问题：在低版本的 IE 浏览器中，Ajax 请求有严重的缓存问题，即在请求地址不发生变化的情况下，只有第一次请求会真正发送到服务器端，后续的请求都会从浏览器的缓存中获取结果。即使服务器端的数据更新了，客户端依然拿到的是缓存中的旧数据。
解决方案：在请求地址的后面加请求参数，保证每一次请求中的请求参数的值不相同。
xhr.open('get', 'http://www.example.com?t=' + Math.random());Ajax 封装
问题：发送一次请求代码过多，发送多次请求代码冗余且重复。
解决方案：将请求代码封装到函数中，发请求时调用函数即可。
ajax({
type: 'get',
url: 'http://www.example.com',
success: function (data) {
console.log(data);
}
})它是浏览器提供的一套方法，可以实现页面无刷新更新数据，提高用户浏览网站应用的体验。
Ajax 的应用场景
页面上拉加载更多数据
列表数据无刷新分页
表单项离开焦点数据验证
搜索框提示文字下拉列表
相关学习推荐：javascript视频教程
以上是認識Ajax基礎之資料請求的詳細內容。更多資訊請關注PHP中文網其他相關文章！
