一、Ajax 基礎(chǔ)

傳統(tǒng)網(wǎng)站中存在的問(wèn)題：

• 網(wǎng)速慢的情況下，頁(yè)面加載時(shí)間長(zhǎng)，用戶只能等待
• 表單提交后，如果一項(xiàng)內(nèi)容不合格，需要重新填寫(xiě)所有表單內(nèi)容
• 頁(yè)面跳轉(zhuǎn)，重新加載頁(yè)面，造成資源浪費(fèi)，增加用戶等待時(shí)間

二、Ajax 概述

Ajax：標(biāo)準(zhǔn)讀音 [?e??d??ks] ，中文音譯：阿賈克斯。
它是瀏覽器提供的一套方法，可以實(shí)現(xiàn)頁(yè)面無(wú)刷新更新數(shù)據(jù)，提高用戶瀏覽網(wǎng)站應(yīng)用的體驗(yàn)。

三、Ajax的應(yīng)用場(chǎng)景

頁(yè)面上拉加載更多數(shù)據(jù)

列表數(shù)據(jù)無(wú)刷新分頁(yè)

表單項(xiàng)離開(kāi)焦點(diǎn)數(shù)據(jù)驗(yàn)證

搜索框提示文字下拉列表

四、Ajax 的運(yùn)行環(huán)境

Ajax 技術(shù)需要運(yùn)行在網(wǎng)站環(huán)境中才能生效，當(dāng)前課程會(huì)使用Node創(chuàng)建的服務(wù)器作為網(wǎng)站服務(wù)器。

五、Ajax 運(yùn)行原理

Ajax 相當(dāng)于瀏覽器發(fā)送請(qǐng)求與接收響應(yīng)的代理人，以實(shí)現(xiàn)在不影響用戶瀏覽頁(yè)面的情況下，局部更新頁(yè)面數(shù)據(jù)，從而提高用戶體驗(yàn)。

六、Ajax 的實(shí)現(xiàn)步驟

創(chuàng)建 Ajax 對(duì)象

var xhr = new XMLHttpRequest();

告訴 Ajax 請(qǐng)求地址以及請(qǐng)求方式

xhr.open('get', 'http://www.example.com');

發(fā)送請(qǐng)求

xhr.send();

獲取服務(wù)器端給與客戶端的響應(yīng)數(shù)據(jù)

xhr.onload = function () {console.log(xhr.responseText);}

待續(xù)。。。

總結(jié)

以上是生活随笔為你收集整理的Ajax 编程基础（一）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。