Layui 介绍

1、下载地址：https://res.layui.com/static/download/layui/layui-v2.5.5.zip?v= 2、结构： -css: -modules -laydate -layer -layim -layui.css -font -images -lay -modules -layui.js -layui.all.js 3、页面引入： ./layui/css/layui.css ./layui/layui.js <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <title>开始使用layui</title> <link rel="stylesheet" href="../layui/css/layui.css"> </head> ........... <script src="../layui/layui.js"></script> 4、全局配置：layui.config layui.config({ dir: '/res/layui/' //layui.js 所在路径（注意，如果是script单独引入layui.js，无需设定该参数。），一般情况下可以无视 ,version: false //一般用于更新模块缓存，默认不开启。设为true即让浏览器不缓存。也可以设为一个固定的值，如：201610 ,debug: false //用于开启调试模式，默认false，如果设为true，则JS模块的节点会保留在页面 ,base: '' //设定扩展的Layui模块的所在目录，一般用于外部模块扩展 }); 5、定义模块： layui.define(function(exports){ //do something

exports('demo', function(){ alert('Hello World!'); }); }); 定义有依赖的模块 layui.define(['layer', 'laypage'], function(exports){ //do something

exports('demo', function(){ alert('Hello World!'); }); }); 6、加载所需模块：layui.use layui.use(['laypage', 'layedit'], function(){ var laypage = layui.laypage ,layedit = layui.layedit;

//do something }); 7、数据存储：layui.data ,layui.sessionData localStorage 持久化存储：layui.data(table, settings)，数据会永久存在，除非物理删除。 sessionStorage 会话性存储：layui.sessionData(table, settings)，页面关闭后即失效。注：layui 2.2.5 新增 //【增】：向test表插入一个nickname字段，如果该表不存在，则自动建立。 layui.data('test', { key: 'nickname' ,value: '贤心' });

//【删】：删除test表的nickname字段 layui.data('test', { key: 'nickname' ,remove: true }); layui.data('test', null); //删除test表

//【改】：同【增】，会覆盖已经存储的数据

//【查】：向test表读取全部的数据 var localTest = layui.data('test'); console.log(localTest.nickname); //获得“贤心” 8、获取设备信息： var device = layui.device(); 9、其他方法