AJAX簡介
一、Ajax概述
?????Ajax的全稱是Asynchronous JavaScript and XML,中文定義為”異步JavaScript和XML”,它是Web2.0技術(shù)的核心,由多種技術(shù)組合而成。使用Ajax技術(shù)不必刷新整個(gè)頁面,只需對(duì)頁面的局部進(jìn)行更新,可以節(jié)省網(wǎng)絡(luò)帶寬,提高網(wǎng)頁加載速度,從而縮短用戶等待時(shí)間,改善用戶體驗(yàn)。 ?Ajax技術(shù)主要包括:客戶端腳本語言JavaScript、異步數(shù)據(jù)獲取技術(shù)XMLHttpRequest、數(shù)據(jù)互換和操作技術(shù)XML和XSLT、動(dòng)態(tài)顯示和交互技術(shù)DOM及基于標(biāo)準(zhǔn)的表示技術(shù)XHTML和CSS等。 Ajax極大的發(fā)掘了Web瀏覽器的潛力,開啟了大量的可能性,從而有效地改善了用戶操作體驗(yàn)。 ??
? 傳統(tǒng)的web應(yīng)用允許用戶填寫表單(form),當(dāng)提交表單時(shí)就向web服務(wù)器發(fā)送一個(gè)請(qǐng)求。服務(wù)器接收并處理傳來的表單,然后返回一個(gè)新的網(wǎng)頁。這個(gè)做法 浪費(fèi)了許多帶寬,因?yàn)樵谇昂髢蓚€(gè)頁面中的大部分HTML代碼往往是相同的。由于每次應(yīng)用的交互都需要向服務(wù)器發(fā)送請(qǐng)求,應(yīng)用的響應(yīng)時(shí)間就依賴于服務(wù)器的響 應(yīng)時(shí)間。這導(dǎo)致了用戶界面的響應(yīng)比本地應(yīng)用慢得多。
??與此不同,AJAX應(yīng)用可以僅向服務(wù)器發(fā)送并取回必需的數(shù)據(jù), 它使用SOAP或其它一些基于XML的web service接口,并在客戶端采用JavaScript處理來自服務(wù)器的響應(yīng)。因?yàn)樵诜?wù)器和瀏覽器之間交換的數(shù)據(jù)大量減少,結(jié)果我們就能看到響應(yīng)更快 的應(yīng)用。同時(shí)很多的處理工作可以在發(fā)出請(qǐng)求的客戶端機(jī)器上完成,所以Web服務(wù)器的處理時(shí)間也減少了。
?
二、Ajax的工作原理
Ajax的核心是JavaScript對(duì)象XmlHttpRequest。該對(duì)象在Internet Explorer 5中首次引入,它是一種支持異步請(qǐng)求的技術(shù)。簡而言之,XmlHttpRequest使您可以使用JavaScript向服務(wù)器提出請(qǐng)求并處理響應(yīng),而不 阻塞用戶。
?
AJAX 基于因特網(wǎng)標(biāo)準(zhǔn)
AJAX 基于因特網(wǎng)標(biāo)準(zhǔn),并使用以下技術(shù)組合:
·???????? XMLHttpRequest 對(duì)象(與服務(wù)器異步交互數(shù)據(jù))
·???????? JavaScript/DOM(顯示/取回信息)
· CSS(設(shè)置數(shù)據(jù)的樣式)
·???????? XML(常用作數(shù)據(jù)傳輸?shù)母袷剑?/p>
?AJAX 應(yīng)用程序與瀏覽器和平臺(tái)無關(guān)的!
?
在創(chuàng)建Web站點(diǎn)時(shí),在客戶端執(zhí)行屏幕更新為用戶提供了很大的靈活性。下面是使用Ajax可以完成的功能:
動(dòng)態(tài)更新購物車的物品總數(shù),無需用戶單擊Update并等待服務(wù)器重新發(fā)送整個(gè)頁面。
提升站點(diǎn)的性 能,這是通過減少從服務(wù)器下載的數(shù)據(jù)量而實(shí)現(xiàn)的。例如,在淘寶的購物車頁面,當(dāng)更新籃子中的一項(xiàng)物品的數(shù)量時(shí),會(huì)重新載入整個(gè)頁面,這必須下載?32K的數(shù)據(jù)。如果使用Ajax計(jì)算新的總量,服務(wù)器只會(huì)返回新的總量值,因此所需的帶寬僅為原來的百分之一。
消除了每次用戶輸入時(shí)的頁面刷新。例如,在Ajax中,如果用戶在分頁列表上單擊Next,則服務(wù)器數(shù)據(jù)只刷新列表而不是整個(gè)頁面。
直接編輯表格數(shù)據(jù),而不是要求用戶導(dǎo)航到新的頁面來編輯數(shù)據(jù)。對(duì)于Ajax,當(dāng)用戶單擊Edit時(shí),可以將靜態(tài)表格刷新為內(nèi)容可編輯的表格。用戶單擊Done之后,就可以發(fā)出一個(gè)Ajax請(qǐng)求來更新服務(wù)器,并刷新表格,使其包含靜態(tài)、只讀的數(shù)據(jù)。