1.什么是ajax
Ajax（四個單詞的縮寫，Asynchronous JavaScript and XML）是一種網友交互的開發技術
可以在頁面不刷新的情況下向服務器發送HTTP請求，並使用JavaScript處理返回的結果
發送Ajax的初衷是為了用戶的表單進行數據驗證，因為在網絡匱乏的年代發送一個請求的速度特別慢，有了Ajax之后可以大大提高表單的提交效率
2.Ajax的用途
Ajax技術在現代網頁中使用的非常廣泛，比如最常見的百度和淘寶 的相關關鍵字提醒，
注冊頁面檢測用戶是否已經存在，瀑布流效果，頁面懶加載效果都是通過Ajax實現的。
3.Ajax的特點
Ajax可以實現頁面的局部刷新，相對於頁面的整體刷新Ajax數據交互的速度更快，用戶等待的時間也更短，用戶體驗也相對較好
不僅如此Ajax還能夠提高頁面的加載速度，就是常說的懶加載效果
對於一些用戶現在瀏覽不到 的頁面選擇不加載等到頁面滾動到目標位置之后，然后通過Ajax請求服務器的數據 來顯示內容
4.ajax的使用
原生的方式請求包括四步
（1）。創建Ajax請求對象
（2）。綁定事件
（3）。初始化
（4) 。發送請求
(GET)
var x = new XMLHttpRequest();
var x.readystatechanges = function(){
if(onreadyState == 4 && status == 200){
console.log(x.responseText);
}
x.open('GET', './server.php?id=2', true);
x.send();
}
(POST)
xmlhttp.setRequestHeader('content-type','application/x-www-form-urlencoded');
發送參數 send('a=100&b=www')
(jquery TP5.0發送ajax)
$.ajax({
url:"{:url('Order/recy_del')}",
type:'POST',
data:{'id':id},
success:function (res) {
if(res.code==1){
layer.msg(res.msg,{icon:1,time:1500},function(){
window.location.reload()
});
}else{
layer.msg(res.msg,{icon:2,time:1500},function(){
window.location.reload();
});
}
},
})
(axios TP5.0發送ajax)
axios.post('/wechat.php/order/xiandan',{'ajaxData':ajaxData,'sid':sid,'mid':mid,'did':did,'price':price}).then(
function(res){
if(res.data){
window.location.href = '/wechat.php/order/dingdanxiangqing?id='+res.data;
}else{
layer.open({skin:'msg', content: '提交訂單失敗！', time: 1.5});
}
}
).catch()
AJAX 可以發送兩種類型請求, GET 和 POST , get 傳參是將參數綴到 url 的后邊, post 傳參需要把參數放置在 send 方法中.
------------------------------------------------------------------------------------------------------------------------------------------
// readyState 是 ajax 對象中的一個屬性, 用來表示ajax對象的狀態, 總共是 5 個值, 0-4
/**
0 代表未初始化
1 正在向服務端發送請求
2 已經接收完全部響應數據
3 表示正在解析數據
4 解析已經完成
*/
// status 是服務器響應的狀態碼
/**
常見的狀態碼有
200 OK
302 跳轉
304 Not Modified
403 Forbidden
404 Not Found
500 內部錯誤
*/
5. 其他的方式
除了原生方式可以發送 AJAX 請求之外, 我們在項目中一般會使用第三方的工具包來發送,
比如 jquery axios(安可C哦斯), 特別是 axios 是專門用來發送請求用的, 現在很多的單頁APP在進行服務器交互的時候 都會使用 axios.
6.數據的返回
在進行數據返回的時候，服務器一般的返回數據是json格式的 JavaScript需要對json格式的數據進行解析，解析的方式json。parse，
如果是jQuery的話可以在發送的時候指定dataType為json，那么返回的數據就直接是json的對象
7.Ajax的缺點
$.getJSON('http://b.com/server.php?callback=?',function(data){
console.log(data)
})
服務器代碼
// b.com 服務器
// server.php
$str = json_encode(['name'=>'zhangsan','age'=>20]);
echo $_GET['callback']."($str)";