ajax 是什么？有什么作用？
- AJAX的全稱是Asynchronous JavaScript and XML（異步的 JavaScript 和 XML）。
- ajax是一種用于創(chuàng)建快速動(dòng)態(tài)網(wǎng)頁的技術(shù)。通過在后臺(tái)與服務(wù)器進(jìn)行少量數(shù)據(jù)交換。ajax可以使網(wǎng)頁實(shí)現(xiàn)異步更新。這意味著可以在不重新加載整個(gè)網(wǎng)頁的情況下，對(duì)網(wǎng)頁的某部分進(jìn)行更新。
作用：實(shí)現(xiàn)網(wǎng)頁的異步加載，局部刷新網(wǎng)頁。當(dāng)在向服務(wù)器獲取新數(shù)據(jù)時(shí)不需要刷新整個(gè)網(wǎng)頁，提高用戶體驗(yàn)
前后端開發(fā)聯(lián)調(diào)需要注意哪些事情？后端接口完成前如何 mock 數(shù)據(jù)？
- 前后端開發(fā)聯(lián)調(diào)注意事項(xiàng)：
- URL：接口名稱
- 發(fā)送請(qǐng)求的參數(shù)和格式（get/post）
- 數(shù)據(jù)響應(yīng)的數(shù)據(jù)格式（數(shù)組/對(duì)象）
- 根據(jù)前后端約定，整理接口文檔
- 后端接口完成前如何 mock 數(shù)據(jù)：
- 安裝 node.js并安裝 server-mock（npm install -g server-mock）
- 選定一個(gè)文件夾當(dāng)作是服務(wù)器，在當(dāng)前文件夾下，創(chuàng)建 router.js 文件，寫好對(duì)應(yīng)接口的響應(yīng)函數(shù)，創(chuàng)造一些假數(shù)據(jù)在當(dāng)前文件夾下。
- 執(zhí)行mock strat可將當(dāng)前文件夾路徑作為根目錄啟動(dòng)web服務(wù)器
點(diǎn)擊按鈕，使用 ajax 獲取數(shù)據(jù)，如何在數(shù)據(jù)到來之前防止重復(fù)點(diǎn)擊?
//偽代碼
var isLoading = true; //添加一個(gè)狀態(tài)鎖 初始為true
var btn = document.qureySelector('#btn');
btn.addEventListener('click',function(){
if(!isLoading) {
return; //判斷點(diǎn)擊后是不是正在加載數(shù)據(jù)，若在加載數(shù)據(jù)點(diǎn)擊沒反應(yīng)
}
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readystate ===4){
if(xhr.status === 200 || xhr.status === 304){
}else{
console.log("error")
}
isLoading = ture; // 如果 readyState = 4，說明響應(yīng)數(shù)據(jù)已經(jīng)到來，狀態(tài)鎖又變成 true，可以再次點(diǎn)擊。
}
xhr.open('open','/getFriends?username=' + input.value,true);
xhr.send()
isLoading = false; //發(fā)送完數(shù)據(jù)后狀態(tài)改為false
})
實(shí)現(xiàn)加載更多的功能
ajax.png
