學習要點： 1.什麼是 jQuery EasyUI 2.學習 jQuery EasyUI 的條件 3.jQuery EasyUI 的功能和優勢 4.其他的 UI 插件 5.是否相容低版本 IE 6.下載及運行 jQuery EasyUI 在正式瞭解 jQuery EasyUI 之前，我們先瞭解一下什 ...
學習要點：
1.什麼是 jQuery EasyUI
2.學習 jQuery EasyUI 的條件 3.jQuery EasyUI 的功能和優勢
4.其他的 UI 插件
5.是否相容低版本 IE
6.下載及運行 jQuery EasyUI
在正式瞭解 jQuery EasyUI 之前，我們先瞭解一下什麼是 jQuery EasyUI。它的學習條件、市場上的同類產品、所支持的瀏覽器等。然後配置運行 jQuery EasyUI。
一．什麼是 jQuery EasyUI
jQuery EasyUI 是一組基於 jQuery 的 UI 插件集合，而 jQuery EasyUI 的目標就是幫助Web 開發者更輕鬆的打造出功能豐富並且美觀的 UI 界面。開發者不需要編寫複雜的JavaScript，也不需要對 css 樣式有深入的瞭解，開發者需要瞭解的只有一些簡單的 html 標簽。
二．學習 jQuery EasyUI 的條件
因為 jQuery EasyUI 是基於jQuery 的 UI 庫，所以，必須需要 jQuery 課程的基礎。而jQuery需要那些基礎，直接參考 jQuery 課程 66 課第一節內容。
三．jQuery EasyUI 的特點
1.基於 jquery 用戶界面插件的集合；
2.為一些當前用於交互的 js 應用提供必要的功能；
3.使用 EasyUI 你不需要寫很多的 javascript 代碼，通常只需要寫 HTML 標記來定義用戶界面即可；
4.支持 HTML5；
5.開發產品時可節省時間和資源；
6.簡單，但很強大；
7.支持擴展，可根據自己的需求擴展控制項；
8.目前各項不足正已版本遞增的方式不斷完善；
9.源代碼加密，商業版付費
四．其他的 UI 插件
除了 jQuery EasyUI 之外，還有 DWZ（國產的，基於 jQuery 的 UI 插件），還有一個獨立的 ExtJS 的 UI 插件。
五．是否相容低版本 IE
我們將要使用最新的 jQuery EasyUI 版本：1.3.5，它裡面自帶的 jQuery 版本是 2.0。也 就是說，不再支持 IE6,7,8 這三款瀏覽器了。如果你必須要使用，可以選擇更低版本。當然，我們已經不在建議相容這些版本了。最基本的原因是：jQuery EasyUI 很少用於 Web 應用的前臺頁面，一般用於後臺的 UI 或者企業級應用的 UI（較為重）。那麼使用這些功能的用戶不會那麼魚龍混雜，一般會被要求使用更高級的瀏覽器，所以沒有必要向下相容。
PS：有部分用戶堅持使用 IE6，聲稱未來會一直使用 IE6。那麼我建議放棄這樣的用戶，因為 IE6 性能低下、記憶體泄漏、不支持高級特性，成倍的開發成本。如果失去這樣的用戶，就面臨停工，那麼死也要會死的痛快點，而如果活下來，那麼也會非常愉快。可是，總是迎合這些低質量用戶，你就像得了慢性病一樣，每天折磨著，痛苦地慢慢死去，就算公司倒閉了，那些客戶還不停電話說，系統有問題，你還要不停解釋公司倒閉了，技術人員全跑了。
六．下載及運行 jQuery EasyUI
下載最新的 jQuery EasyUI1.3.5 版本，然後解壓後直接使用即可。
//HTML5 調用 jQuery EasyUI
<!DOCTYPE html> <html> <head> <title>jQuery Easy UI</title> <meta charset="UTF-8" /> <script type="text/javascript" src="easyui/jquery.min.js"></script> <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script> <script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js" ></script> <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" /> <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" /> </head> <body> <div class="easyui-dialog" style="width:400px;height:200px" data-options="title:'My Dialog',collapsible:true,iconCls:'icon-ok',onOpen:function(){}"> dialog content. </div> </body> </html>
PS：雖然我們用了 HTML5 的格式，但所有標簽還是沿用 XHTML 的，併為真正涉及到HTML5 的標簽和 CSS。
最新的 1.3.5 的 API 中文文檔：漢化人博客：http://blog.sina.com.cn/richie696
備註：本教程出自《李炎恢jQuery EasyUI視頻教程》，請勿用於商業用途，否則後果自負。
