一、介绍
layui（谐音：类 UI) 是一套开源的 Web UI 解决方案，采用自身经典的模块化规范，并遵循原生 HTML/CSS/JS 的开发方式，极易上手，拿来即用。
官网：https://www.layui.com
二、下载安装
<link rel="stylesheet" href="./layui/css/layui.css" />
<script src="./layui/layui.js"></script>
三、模块
layui 定义了一套更轻量的模块规范。并且这种方式在经过了大量的实践后，成为 layui 最核心的模块加载引擎。
1、模块
| 模块名 | 描述 |
|---|---|
| layer | 弹出层组件 |
| laydate | 日期与时间组件 |
| laypage | 分页组件 |
| laytpl | 模板引擎 |
| table | 数据表格 |
| form | 表单组件 |
| upload | 图片/文件上传 |
| dropdown | 下拉菜单组件 |
| transfer | 穿梭框组件 |
| tree | 树形组件 |
| colorpicker | 颜色选择器 |
| element | 元素操作 |
| slider | 滑块组件 |
| rate | 评分组件 |
| carousel | 通用轮播组件 |
| flow | 流加载组件 |
| util | 工具集组件 |
| code | 代码高亮组件 |
2、加载模块
layui 通过 use 方法加载模块
<script>
layui.use('layer','laydate', function(){
var layer = layui.layer;
var laydate = layui.laydate;
});
</script>
3、Jquery
layui 部分模块依赖 jQuer，但是不用去额外加载 jQuery，layui 已经将 jQuery 最稳定的一个版本改为 layui 的内部模块
<script>
layui.use('layer', function(){
var $ = layui.jquery;
});
</script>
