JQuery Easy UI 简介

时间 2019-11-21

标签 jquery easy 简介栏目 JQuery 繁體版

原文原文链接

【什么是JQuery Easy UI？】

jQuery EasyUI 是一组基于 jQuery 的 UI 插件集合，而 jQuery EasyUI 的目标就是帮助Web 开发者更轻松的打造出功能丰富而且美观的 UI 界面。开发者不须要编写复杂的JavaScript，也不须要对 css 样式有深刻的了解，开发者须要了解的只有一些简单的 html 标签。javascript

官方网站：http://www.jeasyui.comcss

【JQuery Easy UI 的特色】

1.基于 jquery 用户界面插件的集合；html

2.为一些当前用于交互的 js 应用提供必要的功能；java

3.使用 EasyUI 你不须要写不少的 javascript 代码，一般只须要写 HTML 标记来定义用户界面便可；jquery

4.支持 HTML5；网站

5.开发产品时可节省时间和资源；ui

6.简单，但很强大；spa

7.支持扩展，可根据本身的需求扩展控件；插件

【其余的UI插件】

除了 jQuery EasyUI 以外，还有 DWZ（国产的，基于 jQuery 的 UI 插件），还有一个独立的 ExtJS 的 UI 插件。code

【下载及运行JQuery Easy UI】

下载最新的 jQuery EasyUI1.3.5 版本，而后解压后直接使用便可。

//HTML5 调用 jQuery EasyUI

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <title>jQuery Easy UI</title>
 5 <meta charset="UTF-8" />
 6 <script type="text/javascript" src="easyui/jquery.min.js"></script>
 7 <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script>
 8 <script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js" ></script>
 9 <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" />
10 <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" />
11 </head>
12 <body>
13 <div class="easyui-dialog" style="width:400px;height:200px"
14 data-options="title:'My Dialog',collapsible:true,iconCls:'icon-ok',onOpen:function(){}">
15 dialog content.
16 </div>
17 </body>
18 </html>

运行结果：