今日在一網上閑逛，尋找一個比較好的Jquery UI，看到這個。特來介紹給大家。
Jquery MiniUI
官網網址：http://www.miniui.com/index.html
示例代碼：http://www.miniui.com/demo/index.html
API手冊：http://www.miniui.com/docs/api/index.html
開發指南：http://www.miniui.com/docs/tutorial/index.html
MiniUI系統架構
跨平台展現層控件
MiniUI是一套Javascript實現的控件庫，包含表單、表格、樹形、布局、導航等系列控件，滿足一體化WEB界面開發的功能需要。
它處於WEB客戶端，為客戶端使用者提供豐富的功能操作和強大控件。
支持JSP、ASP.NET、PHP、ASP、ColdFusion、Ruby on Rails等WEB開發平台。
支持IE6+、FireFox、Chrome、Safari、Opera等瀏覽器。
模塊化設計
MiniUI是基於模塊化思想設計開發的。
一個單獨的控件就是一個獨立的功能模塊，控件與控件之間實現松耦合，互不影響。
比如開發者可以單獨使用datagrid、menu、tree等控件，而不用額外加載其他控件，減少javascipt代碼量加載，優化生成效率。
Note：MiniUI默認包含了所有控件，壓縮后，js體積不超過200k。開發者也可以視開發需要，只加載使用的控件，不加載額外控件。
繼承體系
MiniUI控件是基於"面向對象"思想開發的，控件之間能實現繼承體系，減少重復代碼的出現。
mini.Control是控件基類，實現了id、style、cls、width、height、enabled等屬性，以及render方法。
其他控件都基於mini.Control繼承並擴展而來，從而獲得尺寸、樣式外觀和渲染呈現的能力。
MiniUI的繼承樹非常簡單，盡量避免復雜的繼承關系。任何控件，向上追溯1~3個父類，就可以找到mini.Control。
控件分類
任何一個控件都有屬於自己的功能價值，這也是它為什么設計開發的原因。
MiniUI將控件分為如下五個大類：
- 表單控件：實現輸入框、單選、多選等功能。
- 數據表格：實現列表數據顯示、操作等功能。
- 樹形控件：實現樹形數據顯示、操作等功能。
- 布局控件：實現整體、局部界面特殊方式布局顯示等功能。
- 導航控件：實現界面分類、數據導航顯示等功能。
每一個控件分類都由一個以上控件組成，以實現更細化、更具體的功能。
表格和樹形控件是兩個特殊的分類，它們都是高級而復雜的控件，實現了復雜而豐富的功能。
創建和使用控件對象
如何創建和使用MiniUI控件對象。
首先，使用 "new" 關鍵字來創建一個控件實例：
var button = new mini.Button();
MiniUI的所有控件，都是"mini."開頭，再加上控件名稱。比如"mini.DataGrid"、"mini.ComboBox"等。
然后，設置屬性，並監聽處理事件：
button.setText("Hello"); //設置屬性
button.on("click", onHelloClick); //監聽處理事件
最后，需要將控件對象呈現到頁面內：
button.render(document.body);
HTML標簽化方式創建對象
MiniUI提供了另外一種更簡單的方式來創建和使用控件對象。代碼如下：
<input id="helloBtn" class="mini-button" text="Hello" onclick="onHelloClick"/>
解釋如下：
- class="mini-button"：表示此標簽是mini.Button控件對象。
- text="Hello"：設置對象屬性。
- onclick="onHelloClick"：監聽處理事件
Note：HTML的位置就是控件對象呈現的地方。不需要另外使用render方法將控件渲染呈現到DOM元素內。
MiniUI的所有示例都是用HTML標簽化方式編寫的。
使用HTML方式創建對象，減少80%的Javascript代碼量，更易寫、易讀、易維護。
只有一些事件處理函數，才需要另外寫Javascript方法。
與第三方控件集成
MiniUI非常注重與第三方控件的集成問題。因為控件的功能是有限的，而軟件開發的需求是無限的。
第三方控件有兩種形式：
- Javascript控件：比如jQuery、YUI、Dojo、ExtJS等。
- 插件控件：比如Flash圖表、Silverlight工作流引擎等。
MiniUI的所有控件，有一個獲得控件DOM元素的方法：
var button = mini.get("helloBtn");
var el = button.getEl();
開發者獲得控件的DOM元素后，可以appendChild等方法，將其移動到任何DOM元素內。
如果開發者想將一個Flash圖表對象，設置到mini.Panel面板內，可以這樣操作：
var swfChart = document.getElementById("swfChart"); //獲得Flash圖表DOM元素
var pbodyEl = panel.getBodyEl(); //獲得Panel的bodyEl
pbodyEl.appendChild(swfChart); //將Flash圖表DOM元素，加入到Panel內
Note：通過暴露控件DOM元素對象的方法，開發者可以將MiniUI與任何第三方控件輕松集成。