一、什么是layui
layui 是一款开源的前端UI框架,可以极大的提高程序开发效率。
layui官网链接
二、使用之前的相关配置和处理
1.下载安装包(可以直接从官网下载新版本):
2.将解压后的layui文件夹放在项目的webapp目录下:
3.删除webapp目录下的index.jsp,新建一个index.html:
新建的index.html:
4.引用layui的方法
将css,js引入,加以下代码到index.html中:
<link rel="stylesheet" href="layui/css/layui.css">
<script src="layui/layui.js"></script>
如图所示:
(2)编写第一个layui程序(下边是完整的index.jsp程序):
!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>首页</title>
<link rel="stylesheet" href="layui/css/layui.css">
<script src="layui/layui.js"></script>
<script type="text/javascript">
layui.use(['layer','form','jqury','table'],function () {
//编写自己的layui 代码
let layer =layui.layer;//声明对象
layer.msg('这是第一个layui程序');//使用已经有的api
})
</script>
</head>
<body>
</body>
</html>
(3)运行