對于組件化的軟件工程設計，很多開發人員都比較熟悉。組件化的設計適合于復雜的軟件系統和團隊協作開發。把軟件系統劃分成若干個組件，組件之間通過預先定義好的接口和協議進行通訊和協作，共同完成整個軟件系統的職責。團隊中的開發人員可以各自負責不同的組件。組件化的思想在桌面應用和Web應用后臺開發中比較流行，相關的技術和實踐都比較成熟。

　　而在Web應用的前端部分，組件化一直進展得比較緩慢。這其中的原因有很多，最主要的是Web應用的前端在開始的時候比較簡單，沒有組件化和設計的必要。隨著Ajax應用的流行，Web前端部分越發復雜，用戶對Web應用的要求不斷向桌面應用靠攏。HTML語言的基本界面元素不能單獨地滿足這樣的需求。菜單、樹形控件、對話框和進度條等組件，在現在的Ajax應用中十分常見，但是并不是HTML默認提供的。HTML 5規范中引入了一些新的元素，但還是不夠。組件化對于Web應用本身的代碼共享和團隊分工也是很有意義的。

　　Web 應用前端組件化的發展也是漸進的。開始的時候，只是一些簡單的HTML、CSS加上JavaScript的代碼示例。比如當需要實現一個多級菜單的時候，就下載相關的代碼示例，就根據自己的需要進行修改。這樣的組件比較難以復用。后來JavaScript框架開始流行的時候，有些框架本身就提供了組件的支持，包括Ext JS、jQuery UI和Dojo等。不過不同框架提供的組件模型不盡相同。

　　Dijit組件模型概述

　　Web 應用的前端組件的定義比較寬泛。一個組件占據Web頁面上的某個區域，并負責完成某項具體的任務。Web組件有時候也被稱為小部件（widget）。在 Dijit組件模型中，一個Dijit組件是一個JavaScript類，可以在頁面上通過new操作符來創建組件的實例。每個組件實例都需要與頁面上的某個DOM元素綁定在一起。這個DOM元素就是該組件的根節點。在Dijit組件的邏輯中，就可以對該根節點進行操縱來構建用戶界面。組件 JavaScript類暴露出來的屬性和方法就是該組件的接口。

　　Dijit組件的使用

　　Dijit 組件的使用方式非常簡單。首先需要在頁面上加載組件的JavaScript代碼，這通過dojo.require函數就可以完成。接著在頁面上找到或創建一個DOM元素作為該組件的根節點。最后通過new操作符創建即可。如new dijit.form.ComboBox({}, node)就可以用node作為根元素創建一個dijit.form.ComboBox組件，即一個下拉列表選擇框。可以看到創建Dijit組件的時候，使用了兩個參數：第二個參數是組件的根元素，如果創建的時候不指定該根元素，會自動創建一個新的DIV元素作為根元素。

　　不過該新創建的根元素一般沒有加入到當前的文檔樹中，可以通過組件的placeAt方法來設置該組件在頁面文檔樹中的位置。第一個元素則是一個JavaScript對象，包含了組件的配置屬性。通常來說，一個Dijit組件是可以復用的。因此一般都會提供一些屬性供使用者進行配置。通過這個參數，就可以修改這些配置。

　　上面提到的是程序式的方式創建Dijit組件，還有另外的一種方式來進行創建，即通過在HTML代碼中以聲明式的方式創建，如

<div dojoType="dijit.Dialog" id="myDialog" title="示例對話框">
    <h3>對話框標題</h3>
    <div>對話框內容</div>
</div>        

        

        
        
      
        
NET技術：使用Dijit實現界面組件化開發，轉載需保留來源！
        
鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。