【摘要】人們在上網(wǎng)瀏覽網(wǎng)頁切換頁面時經(jīng)常出現(xiàn)這種情況，即頁面中大部分內(nèi)容是不變的，只有一少部分需要更新。從技術(shù)上來說，如果重新載入這些不變的數(shù)據(jù)，就會浪費網(wǎng)絡(luò)和服務(wù)器的資源，同時也會延長用戶的等待時間。因此近年來，網(wǎng)頁的無刷新技術(shù)得到了比較廣泛的應(yīng)用。本文分析了基于AJAX的網(wǎng)頁無刷新技術(shù)，然后給出了應(yīng)用該技術(shù)的主要代碼。
　　【關(guān)鍵詞】AJAX；ASP；JS
　　【中圖分類號】TP393【文獻標識碼】A
　　【文章編號】1007―4309（2010）10―0084―2
　　
　　一、 總述
　　
　　伴隨著計算機網(wǎng)絡(luò)等信息技術(shù)的發(fā)展，通過互聯(lián)網(wǎng)獲取信息是現(xiàn)在人們認識世界、了解世界的主要方法之一。人們無論在單位還是在家里都可以通過上網(wǎng)得到及時準確的信息。人們在瀏覽網(wǎng)頁時總是希望打開的速度能夠像訪問本機的硬盤數(shù)據(jù)一樣快。但是目前，由于用戶數(shù)量多、網(wǎng)絡(luò)的帶寬有限等原因，用戶打開網(wǎng)頁的時間還是比較長的。于是人們通過各種技術(shù)手段來縮短打開網(wǎng)頁的時間。本文將要分析的就是一種基于AJAX技術(shù)的網(wǎng)頁無刷新技術(shù)，這種技術(shù)可以使用戶在一些情況下切換頁面時極大地提高訪問速度。
　　網(wǎng)頁無刷新技術(shù)是指在進行頁面的切換時，只從網(wǎng)站的服務(wù)器載入發(fā)生變化的數(shù)據(jù)（這在瀏覽網(wǎng)頁時是經(jīng)常遇到的情況），而不變的內(nèi)容無須重新載入。對于傳統(tǒng)方法，在切換頁面時，所有內(nèi)容都需要從服務(wù)器端重新載入到本地的計算機，這樣浪費了大量的網(wǎng)絡(luò)帶寬，加重了服務(wù)器的負擔，用戶也需要花費更多的等待時間。AJAX（Asynchronous JavaScript and XML）包括了XHTML和CSS、XML和 XSTL、Javascript、DOM（Document Object Model）、XMLHttpRequest等技術(shù)，實際上是多種技術(shù)的綜合。XHTML和CSS能夠?qū)崿F(xiàn)標準化呈現(xiàn)；XML和XSTL能夠進行數(shù)據(jù)交換與處理；Javascript能夠綁定和處理所有數(shù)據(jù)；DOM能夠?qū)崿F(xiàn)動態(tài)顯示和交互；XMLHttpRequest能夠?qū)�對象進行異步數(shù)據(jù)讀取。事實上，在沒有提出AJAX之前，業(yè)界只是單獨地使用上述技術(shù)，而沒有對其進行綜合使用。隨著網(wǎng)頁無刷新技術(shù)的應(yīng)用及其廣泛發(fā)展，人們也開始逐漸使用AJAX了。
　　
　　二、相關(guān)技術(shù)介紹
　　
　　傳統(tǒng)的Web應(yīng)用采用同步交互過程，在這種情形下，用戶首先向HTTP服務(wù)器觸發(fā)一個行為或請求的呼求。反過來，服務(wù)器執(zhí)行某些任務(wù)，再向發(fā)出請求的用戶返回一個HTML頁面。這種用戶體驗是不連貫的，服務(wù)器在處理請求的時候，用戶多數(shù)時間處于等待的狀態(tài)，屏幕內(nèi)容也是一片空白。
　　AJAX與傳統(tǒng)Web的應(yīng)用是不同的，它采用了異步交互過程。AJAX能夠消除網(wǎng)絡(luò)交互過程中的處理―等待―處理―等待的缺點。這是因為，它在用戶與服務(wù)器之間引入了一個中間媒介。用戶的瀏覽器在執(zhí)行任務(wù)時即裝載AJAX 引擎。AJAX引擎用JavaScript語言編寫，通常藏在一個隱藏的框架中，它負責編譯用戶界面及與服務(wù)器之間的交互。AJAX引擎是獨立于用戶與網(wǎng)絡(luò)服務(wù)器間的交流的，它允許用戶與應(yīng)用軟件之間的交互過程異步進行�，F(xiàn)在，可以用Javascript調(diào)用AJAX引擎來代替產(chǎn)生一個 HTTP的用戶動作，可以將不需要重新載入整個頁面的需求，如頁面導(dǎo)航、數(shù)據(jù)校驗、內(nèi)存中的數(shù)據(jù)編輯交給AJAX來執(zhí)行。
　　通過XML可以規(guī)范地定義結(jié)構(gòu)化數(shù)據(jù)，使網(wǎng)上傳輸?shù)臄?shù)據(jù)和文檔符合統(tǒng)一的標準。用XML表述的數(shù)據(jù)和文檔，可以很容易地讓所有程序共享。
　　DOM是一組API，是提供給HTML和XML使用的，它提供了文件的表述結(jié)構(gòu)，使用它也可以改變其中的內(nèi)容和可見物。腳本語言要想同頁面進行交互，需要通過DOM才能實現(xiàn)。
　　
　　三、無刷新網(wǎng)頁的實現(xiàn)
　　
　　下面就以為某公司建立的內(nèi)部網(wǎng)站中的一個無刷新網(wǎng)頁為例說明一下AJAX的應(yīng)用。公司OA中的即時通訊原來采用窗口的定時刷新自動獲取消息等信息，但采用這種技術(shù)的缺點很明顯，不僅性能低下，而且由于需要頻繁刷新頁面，用戶也不太滿意。采用AJAX技術(shù)后得到了很好的改善。實現(xiàn)此功能的所有文件包括：login.asp、online.asp、 getonlineuser.asp。
　　login.asp程序執(zhí)行一般的登陸操作，并將自身添加進在線用戶表(onlineuser)中。用online.asp頁來顯示用戶在線情況，主要顯示在線人數(shù)、在線人員列表、離線人數(shù)、離線人員列表。主要代碼如下：
　　Dim rv
　　（以下代碼是在頁面加載時，生成所有用戶列表的xml片段。）rv=rv & ""
　　strSql="Select * From Userinf Order By username"
　　Set rs=conn.execute(strSql)
　　While Not rs.Eof
　　 rv=rv & ""
　　 rs.movenext
　　Wend
　　rv=rv & ""
　　 rs.close：Set rs=Nothing
　　var xmlDom
　　 var xmlDom = new ActiveXObject("Microsoft.XMLDOM")
　�。ê瘮�(shù)initList()，加載剛才生成的所有用戶列表）
　　function initList()
　　{
　　xmlDom.async=false;
　　xmlDom.loadXML("");
　　 }
　�。ê瘮�(shù)updateList()，刷新在線情況顯示）
　　function updateList()
　　 {
　　var root = xmlDom.documentElement;
　　 var obj=root.selectNodes("UserName[@On=’true’]");
　　onlinecount.innerHTML=obj.length;
　　var nRow=online.rows.length;
　�。ㄇ宄�當前所有列表）
　　 for(j=0;j 　　Dim rv
　　Dim rs，strSql
　�。ǜ�新當前用戶的在線狀態(tài)）
　　strSql="Update onlineuser Set lastdate=’" & now & "’ Where userid=’" & username & "’" conn.execute(strSql)
　�。▌h除無活動用戶）
　　strSql="delete from OnlineUser where datediff(’n’，lastdate，now())>2"
　　conn.execute(strSql)
　　（獲取在線用戶）
　　strSql="Select * From OnlineUser Order By userid"
　　Set rs=conn.execute(strSql)
　　rv="" & vbCrlf
　　rv=rv & "" & vbCrlf
　　rv=rv & "" & vbCrlf
　　While Not rs.Eof
　　rv=rv & "" & trim(rs(1)) & "" & vbCrlf
　　 rs.movenext
　　Wend
　　rv=rv & "" & vbCrlf
　　rs.close：Set rs=Nothing
　　 rv=rv & "" & vbCrlf
　�。ǚ祷豿ml文件至客戶端給online.asp文件中的getOnlineUser()函數(shù)） Response.ContentType = "text/xml"
　　 Response.CharSet = "GB2312"
　　response.write rv
　　
　　四、結(jié)論
　　
　　通過以上的分析及實際應(yīng)用，對于開發(fā)人員、終端用戶、ISP來說，AJAX是大有益處的。
　　第一，減輕服務(wù)器的負擔�！鞍葱枞�數(shù)據(jù)”是AJAX的原則，這不僅可以將冗余請求減到最少，而且也能最大程度地減少服務(wù)器的負擔。
　　第二，可以使用戶的等待時間減少。尤其是不會像Reload事件那樣，當要讀取大量數(shù)據(jù)的時候，就會出項白屏的現(xiàn)象。AJAX使用XMLHTTP對象發(fā)送請求并得到服務(wù)器響應(yīng)，在不重新載入整個頁面的情況下更新頁面。因此在讀取數(shù)據(jù)的過程中，用戶所面對的不再是白屏，而是原來的頁面內(nèi)容。當數(shù)據(jù)接收完畢之后才更新相應(yīng)部分的內(nèi)容。這種更新的速度非常快，幾乎就是一瞬間，用戶幾乎感覺不到。
　　第三，使效率大大提高�？梢岳�用客戶端閑置的能力來處理以前一些服務(wù)器負擔的工作，從而減輕服務(wù)器和帶寬的負擔。
　　第四，可以調(diào)用外部數(shù)據(jù)。AJAX技術(shù)也不是完美的，也存在著一些突出的缺陷。AJAX大量地使用了取決于瀏覽器支持的AJAX和JS（Javascript）引擎。因此，使用 AJAX就必須要測試針對各個瀏覽器的兼容性。AJAX在更新頁面內(nèi)容的時候，并沒有對整個頁面進行刷新，因此后退功能在網(wǎng)頁中是無效的，還有一些用戶經(jīng)常弄不清楚數(shù)據(jù)是否已經(jīng)被更新過，這就需要在明顯位置具有“數(shù)據(jù)已更新”的提醒字樣，起到提醒用戶的作用。在對流媒體的支持方面，相比JavaApplet和FLASH來說，AJAX也是較差的。
　　
　　【參考文獻】
　　[1]Nicholas C.Zakas，Jeremy McPeak，Joe Fawcett著，徐鋒，吳蘭陟譯. Ajax高級程序設(shè)計[M]. 北京：人民郵電出版社，2006.
　　[2]顧兵.XML實用技術(shù)教程[M].北京：清華大學(xué)出版社，2007.
　　[3]劉好增，張坤.ASP動態(tài)網(wǎng)站開發(fā)實踐教程[M].北京：清華大學(xué)出版社，2007.
　　【收稿日期】2010年9月5日
　　【作者簡介】李鳳祥（1972― ）：男，遼寧凌源人，沈陽鐵路機械學(xué)校信息部講師，研究方向：計算機教學(xué)。

相關(guān)熱詞搜索：刷新 網(wǎng)頁 技術(shù) 基于AJAX的網(wǎng)頁無刷新技術(shù) ajax無刷新技術(shù) ajax無刷新更新數(shù)據(jù)