AJAX 即 “Asynchronous JavaScript and XML”（異步的 JavaScript 與 XML 技術(shù)）框舔，AJAX的概念由Jesse James Garrett 提出螺男。
AJAX 的使用方法：
- 使用 XMLHttpRequest 發(fā)請(qǐng)求
- 服務(wù)器返回 XML 格式的字符串
- JS 解析 XML汁针，并更新局部頁(yè)面
使用原生JS發(fā)送AJAX請(qǐng)求
前端代碼
myButton.addEventListener('click', (e) => {
// 聲明一個(gè)XMLHttpRequest對(duì)象
let request = new XMLHttpRequest();
// 初始化一個(gè)請(qǐng)求, 參數(shù)為 方法 路徑 是否異步（默認(rèn)為是）
request.open('GET', '/xxx')
request.onreadystatechange = () => {
if (request.readyState === 4) {
/* readyState 代理當(dāng)前所處的狀態(tài)：
* 0 代理被創(chuàng)建，但未調(diào)用 open()方法
* 1 open() 被調(diào)用，send() 未調(diào)用
* 2 send() 被調(diào)用岂丘，且頭部和狀態(tài)已經(jīng)可獲得
* 3 響應(yīng)體下載中；responseText 中已獲取部分?jǐn)?shù)據(jù)
* 4 下載操作已完成
**/
if (request.status >=200 && request.status <300) {
console.log(request.responseText);
} else if(request.status >= 400) {
console.log('請(qǐng)求失敗')
}
}
};
// 發(fā)送請(qǐng)求
request.send();
});
后端代碼
if (path == '/xxx') {
response.statusCode = 200;
response.setHeader('Content-Type', 'text/json; charset=utf-8')
response.write(`
{
"student": {
"name": "張三",
"age": "20",
"school": "實(shí)驗(yàn)學(xué)校"
}
}
`)
response.end()
}
