1.什麼是AJAX呢？
AJAX是與服務器交換數據並更新部分網頁的藝術，在不重新加載整個頁面的情況下
比如說：淘寶搜索框搜索一件物品時，會重新加載頁面，不是使用的AJAX,但是搜索框下面的提示內容是沒有重新加載頁面的，則是用AJAX完成的
2.如何使用AJAX
HTML代碼 b.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- 括號裏的ev,ev1,是event事件對象，所有的鼠標移動，鍵盤點擊的詳細狀況都保存在這個形參裏面-->
<script>
window.onload=function(ev){
var oBtn=document.querySelector("button")
oBtn.onclick=function(ev1){
// 1.創建一個異步對象
var xmlhttp=new XMLHttpRequest();
//2.設置請求方式和請求地址(給創建的異步對象設置)
/*
method:請求的類型：GET或POST
url:文件在服務器上的位置
async:true(異步)或false(同步) AJAX是異步請求，所以括號裏永遠填true
*/
xmlhttp.open("GET","a.php",true)
//3.發送請求 異步對象發送請求
xmlhttp.send();
//4.監聽狀態的變化 監聽的是異步對象的變化 只要異步請求發生了變化，就調用這個回調函數，代表請求已經完成
xmlhttp.onreadystatechange=function(ev2){
if(xmlhttp.readyState===4){
/*
存有 XMLHttpRequest 的狀態。從 0 到 4 發生變化。
0: 請求未初始化
1: 服務器連接已建立
2: 請求已接收
3: 請求處理中
4: 請求已完成，且響應已就緒
*/
//判斷是否請求成功 http狀態碼
if(xmlhttp.status>=200&&xmlhttp.status<300||
xmlhttp.status===304){
//5.處理返回的結果
console.log("接收到服務器返回的數據");
}else{
console.log("沒有接收到服務器返回的數據");
}
}
}
}
}
</script>
</head>
<body>
<button>發送請求</button>
</body>
</html>
PHP代碼 a.php
<?php
echo "ajax get page";
如果將第二步設置請求方式和請求地址的url改成不存在的地址，比如b.php，則接收不到服務器返回的數據
