0网址：
http://www.jeasyui.net/（中文网）
http://www.jeasyui.com/（英文版）
EasyUI官方下载地址：http://www.jeasyui.com/download/index.php
1.什么是easyui？
easyui是一种基于jQuery的用户界面插件集合
easyui是基于jQuery、Angular.、Vue和React的用户界面组件的集合。
easyui提供了构建现代交互式javascript应用程序的基本功能。
使用easyui，您不需要编写许多javascript代码，通常通过编写一些HTML标记来定义用户界面。
完整的HTML5网页框架。
使用easyui开发你的产品时可以大量节省你的时间和规模。
easyui使用非常简单但功能非常强大。
2.easyui能带给我们什么好处？
1）easyui是个完美支持HTML5网页的完整框架
2）easyui节省网页开发的时间和规模
3）easyui很简单但功能强大
3.easyui如何使用？
3.1 引入必要的js和css样式文件
1）引入JQuery（jquery.min.js）
2）引入EasyUI（jquery.easyui.min.js）
3）引入EasyUI的中文国际化js，让EasyUI支持中文（locale/easyui-lang-zh_CN.js）
4）引入EasyUI的样式文件（/themes/default/easyui.css）
5）引入EasyUI的图标样式文件（/themes/icon.css）
3.2 路径问题
3.2.1 相对路径/绝对路径
3.2.2 base标签:仅作用于head标签之间的script和link标签上，src、href
3.3 页面缓存
4.组件
分类：Base（基础）、Layout（布局）、Menu and Button（菜单和按钮）、Form（表单）、Window（窗口）、
DataGrid and Tree（表格和树）、Extension（扩展）
本章节主要讲述以下组件的使用：
1）layout（布局组件）
2）accordion（分类组件）
3）tree（树形组件）
4）tabs（选项卡组件）
5）datagrid和pagination（表格和分页组件）
6）dialog和messager（窗口组件）
7）form（表单组件）
5.功能实现流程
1）使用layout完成后台管理界面布局；
2）通过Ajax动态添加一级菜单Accordion；
3）通过Accordion的onSelect事件动态绑定Tree组件数据；
4）选中Tree组件中的子节点动态创建Tab页签；
frameLabelStart--frameLabelEnd
tab .tabs-panels>.panel>.panel-body {
overflow: hidden;
}
https://echarts.apache.org/examples/zh/index.html
https://www.highcharts.com.cn/
1.DataGrid
5.1 DataGrid基本属性
5.1.1 基本属性
url : '', // 初始化请求路径
fitcolumns : false, // 列宽自适应
singleSelect : true, // 是否选中单行
checkOnSelect : true, // 点击行选中时该checkbox选中或取消选中
rownumbers:true, // 行号
fit : true, // 高宽自适应
border : false, // 是否显示边框
title : '书本列表', // datagrid标题
striped : true, // 显示斑马线效果
5.1.2 toobar属性（增删改）
toolbar : "#tb", // 自定义工具栏
5.1.3 formatter单元格格式化
5.1.4 styler单元格样式
5.1.5 sorter
5.1.6 editor
5.2 DataGrid事件
5.2.1 onDblClickRow双击行事件
onDblClickRow:function(index,row){}
5.2.2 按钮点击查询
//查询参数
var param={
'bookName':$('#bookname').val(),
'methodName':'query'};
var options = $('#dg').datagrid('options');
//指定请求Url地址
options.url="bookAction.action";
//开始加载数据
$('#dg').datagrid('load', param);
5.3 DataGrid分页
5.3.1 属性设置
pagination:true, // 是否分页
pageNumber:1, // 初始化页码
pageSize:10, // 初始化每页显示条数
5.3.2 请求/响应参数格式要求
Request请求：{"page":页码,"rows":每页多少条记录}
Response响应：{"total":总记录数,"rows":[{数据项1},{数据项2},{数据项3},...]}
6.Dialog对话框窗口
width : 400,
height : 292,
modal : true,
draggable : true,
collapsible : false,
minimizable : false,
maximizable : false,
title : '编辑书本信息',
buttons:"#dlg-buttons",
href:'bookDetail.jsp',
onLoad:function(){
//赋值
$('#ff').form('load',row);
//重置
$('#ff').form('reset');
}
7.Message消息窗口
3.1 $.messager.alert
3.2 $.messager.confirm
8.Form表单
$('#ff').form("submit",{
url:'',
onSubmit: function(){
//form表单验证
return $(this).form('validate');
},
success:function(data){
} });
//form表单序列化
$('#ff').serialize();
