Ajax+PHP實現動態無重新整理技術

來源:互聯網
上載者:User

據介紹通達OA 簡訊、線上人員、郵件檢查機制,全部採用無重新整理技術。我分析後通達用的是Ajax技術。Ajax是多種技術的綜合,是一種動態可以實現WEB頁面局部重新整理的技術。

Ajax的基本原理

Ajax實現的web互動效果跟傳統的大不相同,它通過Ajax 引擎,使得應用過程很自然,操作很流暢,因為其只和伺服器交換有用的資料,而頁面顯示等不必要的資料則不再重新載入。Ajax 引擎其實就是JavaScript、XML、XMLHttpRequest等等各項技術的綜合應用。

Ajax技術組成:

1.標準化呈現:XHTML、CSS

2.動態顯示和互動:DOM

3.資料交換和處理:XML、XSLT

4.粘合劑:JavaScript,

Ajax的優點:

1.減輕伺服器端負擔,“按需取資料”。

2.無重新整理更新頁面。

3.帶來更好的使用者體驗。

4.充分利用用戶端閑置的運算能力。

5.進一步促進呈現和資料的分離。

6.完全基於標準化的技術實現,無須下載小程式或外掛程式。

7.瀏覽器無關(IEownload, XML island)

Ajax適用的情境:

1.表單驅動的互動

2.深層次的樹的導航

3.快速的使用者與使用者間的交流響應

4.類似投票、yes/no等無關痛癢的情境

5.對資料進行過濾和操縱相關資料的情境

6.普通的文本輸入提示和自動完成的情境

Ajax不適用的情境:

1.部分簡單的表單

2.搜尋不能back(使用IFrame)

3.基本的導航

4.替換大量的文本

5.對呈現的操縱

Ajax應用存在的問題:

1.用JavaScript作的Ajax引擎,JavaScript的相容性和debug都是讓人頭痛的事。

2.Ajax的無重新整理重載,由於頁面的變化沒有重新整理重載那麼明顯,所以容易給使用者帶來困擾。

3.中間過程不能被bookmark。(兩個方法解決)

使用WEB標準開發:

1.系統現狀對應用的自適應性和市場拓展都有阻礙。

2.完全採用符合web標準的方式來開發web層,以支援所有的市場上流行的瀏覽器,達到很高的可用性。

3.包括使用XHTML,CSS(完全布局),Ajax等標準化技術。(結構/展現/行為完全分離)

4.使用Firefox作為開發環境,瀏覽器移植問題就會得到解決。

 

AJAX全稱為“Asynchronous JavaScript and XML”(非同步JavaScript和XML),是指一種建立互動式網頁應用的網頁開發技術。它有機地包含了以下幾種技術:

Ajax(Asynchronous JavaScript + XML)的定義:基於web標準(standards-based presentation)XHTML+CSS的表示; 使用 DOM(Document Object Model)進行動態顯示及互動;使用 XML 和 XSLT 進行資料交換及相關操作; 使用 XMLHttpRequest 進行非同步資料查詢、檢索; 使用 JavaScript 將所有的東西綁定在一起。

類似於DHTML或LAMP,AJAX不是指一種單一的技術,而是有機地利用了一系列相關的技術。事實上,一些基於AJAX的“派生/合成”式(derivative/composite)的技術正在出現,如“AFLAX”。

AJAX的應用使用支援以上技術的web瀏覽器作為運行平台。這些瀏覽器目前包括:Mozilla、Firefox、Internet Explorer、Opera、Konqueror及Safari。但是Opera不支援XSL格式對象,也不支援XSLT。

Ajax技術的核心

Ajax其核心只有JavaScript、XMLHTTPRequest和DOM,如果所用資料格式為XML的話,還可以再加上XML這一項(Ajax從伺服器端返回的資料可以是XML格式,也可以是文本等其他格式)。

在舊的互動方式中,由使用者觸發一個HTTP請求到伺服器,伺服器對其進行處理後再返回一個新的HTHL頁到用戶端,每當伺服器處理用戶端提交的請求時,客戶都只能空閑等待,並且哪怕只是一次很小的互動、只需從伺服器端得到很簡單的一個資料,都要返回一個完整的HTML頁,而使用者每次都要浪費時間和頻寬去重新讀取整個頁面。而使用Ajax後使用者從感覺上幾乎所有的操作都會很快響應沒有頁面重載(白屏)的等待。

1.XMLHTTPRequest

Ajax的一個最大的特點是無需重新整理頁面便可向伺服器傳輸或讀寫資料(又稱無重新整理更新頁面),這一特點主要得益於XMLHTTP組件XMLHTTPRequest對象。這樣就可以向再發傳統型應用程式只同伺服器進行資料層面的交換,而不用每次都重新整理介面也不用每次將資料處理的工作提交給伺服器來做,這樣即減輕了伺服器的負擔又加快了響應速度、縮短了使用者等候時間。

最早應用XMLHTTP的是微軟,IE(IE5以上)通過允許開發人員在Web頁面內部使用XMLHTTP ActiveX組件擴充自身的功能,開發人員可以不用從當前的Web頁面導航而直接傳輸資料到伺服器上或者從伺服器取資料。這個功能是很重要的,因為它協助減少了無狀態串連的痛苦,它還可以排除下載冗餘HTML的需要,從而提高進程的速度。Mozilla(Mozilla1.0以上及NetScape7以上)做出的回應是建立它自己的繼承XML代理類:XMLHttpRequest類。Konqueror (和Safari v1.2,同樣也是基於KHTML的瀏覽器)也支援XMLHttpRequest對象,而Opera也將在其v7.6x+以後的版本中支援XMLHttpRequest對象。對於大多數情況,XMLHttpRequest對象和XMLHTTP組件很相似,方法和屬性也類似,只是有一小部分屬性不支援。

2.JavaScript

JavaScript是一在瀏覽器中大量使用的程式設計語言,,他以前一直被貶低為一門糟糕的語言(他確實在使用上比較枯燥),以在常被用來作一些用來炫耀的小玩意和惡作劇或是單調瑣碎的表單驗證。但事實是,他是一門真正的程式設計語言,有著自已的標準並在各種瀏覽器中被廣泛支援。

3.DOM

Document Object Model。 DOM是給 HTML 和 XML 檔案使用的一組 API。它提供了檔案的結構表述,讓你可以改變其中的內容及可見物。其本質是建立網頁與 Script 或程式語言溝通的橋樑。所有WEB開發人員可操作及建立檔案的屬性、方法及事件都以對象來展現(例如,document 就代表“檔案本身“這個對像,table 對象則代表 HTML 的表格對象等等)。這些對象可以由當今大多數的瀏覽器以Script 來取用。一個用HTML或XHTML構建的網頁也可以看作是一組結構化的資料,這些資料被封在DOM(Document Object Model)中,DOM提供了網頁中各個對象的讀寫的支援。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.