背景：在上世紀(jì)90年代，幾乎所有的網(wǎng)站都由HTML頁面實(shí)現(xiàn)，服務(wù)器處理每一個(gè)用戶請(qǐng)求都需要重新加載網(wǎng)頁。用戶體驗(yàn)極差！由于每次應(yīng)用的溝通都需要向服務(wù)器發(fā)送請(qǐng)求，應(yīng)用的回應(yīng)時(shí)間依賴于服務(wù)器的回應(yīng)時(shí)間。這導(dǎo)致了用戶界面的回應(yīng)比本機(jī)應(yīng)用慢得多。

Ajax簡(jiǎn)介

Ajax 并不算是一種新的技術(shù)，全稱是 asynchronous javascript and xml，可以說是已有技術(shù)的組合，主要用來實(shí)現(xiàn)客戶端與服務(wù)器端的異步通信效果，實(shí)現(xiàn)頁面的局部刷新

Ajax優(yōu)缺點(diǎn)

優(yōu)點(diǎn)

頁面局部刷新，用戶體驗(yàn)好。

異步通信，更加快的響應(yīng)能力。

減少冗余請(qǐng)求，減輕了服務(wù)器負(fù)擔(dān)；按需獲取數(shù)據(jù)，節(jié)約帶寬資源。

基于標(biāo)準(zhǔn)化的并被廣泛支持的技術(shù)，不需要下載插件或者小程序

缺點(diǎn)

ajax干掉了back按鈕和加入收藏書簽功能，即對(duì)瀏覽器后退機(jī)制的破壞。

存在一定的安全問題，AJAX 暴露了與服務(wù)器交互的細(xì)節(jié)。

對(duì)搜索引擎的支持比較弱。

破壞了程序的異常機(jī)制。

無法用URL直接訪問

創(chuàng)建Ajax的步驟

【1】創(chuàng)建XMLHttpRequest

XMLHttpRequest 是 AJAX 的基礎(chǔ)。XMLHttpRequest 用于在后臺(tái)與服務(wù)器交換數(shù)據(jù)。這意味著可以在不重新加載整個(gè)網(wǎng)頁的情況下，對(duì)網(wǎng)頁的某部分進(jìn)行更新。所有現(xiàn)代瀏覽器均支持 XMLHttpRequest 對(duì)象（IE5 和 IE6 使用 ActiveXObject）。

【2】向服務(wù)器發(fā)送請(qǐng)求

如需將請(qǐng)求發(fā)送到服務(wù)器，我們使用 XMLHttpRequest 對(duì)象的 open() 和 send() 方法

注意：open 的參數(shù)要牢記，很多面試官愛問這樣的細(xì)節(jié)

method：請(qǐng)求的類型；GET 或 POST

url：文件在服務(wù)器上的位置

async：true（異步）或 false（同步）

send(string)方法post請(qǐng)求時(shí)才使用字符串參數(shù)，否則不用帶參數(shù)。

注意：post請(qǐng)求一定要設(shè)置請(qǐng)求頭的格式內(nèi)容

【3】處理服務(wù)器響應(yīng)

當(dāng)請(qǐng)求被發(fā)送到服務(wù)器時(shí)，我們需要執(zhí)行一些基于響應(yīng)的任務(wù)。每當(dāng) readyState 改變時(shí)，就會(huì)觸發(fā) onreadystatechange 事件。readyState 屬性存有 XMLHttpRequest 的狀態(tài)信息。