Dijit、ExtJS、jQuery UI 簡介
Dojo 是開源 ja vasc ript 庫中起步較早的先行者之一。由 Alex Russell, David Schontzler, Dylan Schiemann 等人于 2004 年創立。Dojo 具有類似 Java 的包機制 (packaging system), 將 JS 代碼根據功能進行了模塊化。主要包含 Dojo、Dijit 以及 Dojox 三個包。其中 Dojo 包提供穩定的內核 API,Dijit 包提供各類 UI 控件,Dojox 包則囊括了一系列實驗性的 API 及控件(其中不乏一些得到長期維護、穩定性已相當高的包,如 dojox.
ExtJS 是當今一套被廣泛應用于前端開發的 Ajax 以及控件框架,其歷史可以追溯到 Yahoo! User Interface。在 Jack Slocum 的耕耘下,ExtJS 逐漸成長。自從 ExtJS 的 2.0 版本發布后,其使用范圍逐漸擴展到世界各地。3.X 版本中推出了更多易用的控件,ExtJS 的優勢在于其強大的控件庫,以及其對于各種前臺功能的封裝,形成了完整的一套面向對象風格的 JS 控件庫。隨著和 Sencha 合并,ExtJS 也向觸摸屏發展,不過其 Ext JS 庫的發展從未停止。如今的 ExtJS 4.0 提供了更完整的 ja vasc ript API 庫,減少對 Array、Function、String 等底層類的重寫,大大的減少了不同的 JS 庫之間的沖突問題。由于 4.0 版本不向下兼容,對升級造成了一定的影響,筆者還沒有機會去深入使用 ExtJS 4.0 版本,因此本文著重介紹的是 ExtJS 3.X 版本。
jQuery UI 是 jQuery 的官方 UI 控件庫。jQuery 的大名在業內可謂是無人不知無人不曉。自 2006 年發布了其第一個穩定版之后,其輕量、易用的特點使其深入人心。jQuery UI 于 2007 年發布,它完全基于 jQuery 提供的插件機制,提供了底層交互及動畫功能以及一些可定制樣式的 UI 控件。雖然提供的控件數量不多,但它們都具備了 jQuery 小巧的特點,其使用風格也與 jQuery 核心 API 一致。撰寫本文時,其最新的穩定版本為 1.8.16,本文中關于 jQuery UI 的內容都基于該版本。
控件的使用方式
在討論各個控件庫的架構實現之前,首先讓我們從用戶的角度來看看 Dijit、ExtJS、jQuery UI 控件的的使用方式,對它們有一個直觀的了解。
控件的使用無外乎創建控件、操作控件,而在創建控件之前,我們往往需要先加載控件資源。下面就讓我們從控件資源加載開始聊起(控件 CSS 文件編寫與加載不在本文范圍內)。
控件資源加載
Dijit 篇:借助于 Dojo 提供的自動加載模塊依賴項的機制,加載 Dijit 控件所需資源非常簡單,用戶并不需要了解一個控件究竟需要哪些 JS 文件的支持,只需向頁面添加 Dojo 核心文件 dojo.js 并使用 dojo.require 函數導入控件對應模塊即可。
清單 1. Dijit 資源加載
<sc ript type="text/ja vasc ript" src="lib/dojo/dojo.js"></sc ript>
<sc ript type="text/ja vasc ript">
dojo.require("dijit.form.Button");
</sc ript>
上述代碼將自動加載 Button 控件所依賴的所有 JS 文件。
ExtJS 篇:ExtJS 本身沒有一套完整的自動加載依賴資源的機制,在大多數情況下,用戶都是使用完整的 ExtJS 庫,只需要導入 /ExtJS/adapter/ext/ext-base.js 和 /ExtJS/ext-all.js 這 2 個文件即可。一般情況下為了方便調試,會使用 ext-base-bug.js 和 ext-all-debug.js 這 2 個文件。
新聞熱點
疑難解答