獲得Layui
#你可以在官網首頁下載到Layui 的最新版，也可以透過GitHub 得到Layui的開源套件。目前只同步維護這兩個資源管道。一般如果你是用於實際項目，推薦你直接從官網下載。 layui建置後的結構（也就是你獲得的套件）
├─css //css目录
│ └─modules //模块css目录（一般如果模块相对较大，我们会单独提取）
│ ├─laydate
│ ├─layer
│ │ └─default
│ └─layim
│ └─skin
├─font //字体图标目录
├─images //图片资源目录（一些表情等）
│ └─face
└─lay //JS目录
│ ├─dest //经过合并的完整模块
│ └─modules //各模块/组件
└─layui.js快速上手
獲得layui後，將其完整地部署到你的專案目錄（或靜態資源伺服器），你只需要引入下述兩個檔案：
./layui/css/layui.css ./layui/layui.js
沒錯，不用去管其它任何檔案。因為他們（例如各模組）都是在最終使用的時候才會自動載入。這是一個基本的入門頁面：
<!DOCTYPE html>
<html>
<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="build/css/layui.css">
</head>
<!-- 你的HTML代码 -->
<script src="build/layui.js"></script>
<script>
//一般直接写在一个js文件中
layui.use(['layer', 'form'], function(){
var layer = layui.layer
,form = layui.form();
layer.msg('Hello World');
});
</script>
</body>
</html>規範化的用法（推薦）
如果你想快速使用Layui的元件，你還是跟平常一樣script標籤引入你的js文件，然後在你的js檔案中使用layui的元件。但我們更推薦你遵循Layui的模組規範，建立一個自己的模組作為入口：
<script>
layui.config({
base: '/res/js/modules/' //你的模块目录
}).use('index'); //加载入口
</script>上述的index 即為你/res/js/modules/ 目錄下的index.js，它的內容應該如下：
<script>
/**
项目JS主入口
以依赖Layui的layer和form模块为例
**/
layui.define(['layer', 'form'], function(exports){
var layer = layui.layer
,form = layui.form();
layer.msg('Hello World');
exports('index', {}); //注意，这里是模块输出的核心，模块名必须和use时的模块名一致
});
</script>簡單粗暴用法
如果你覺得Layui的模組化還是有點囉嗦，木有關係的親。 Layui考慮到了像你一樣的猿群，我們將layui.js及所有模組單獨打包合併成了一個完整的js文件，用的時候直接引入這一文件即可。當你採用這樣的方式，你無需再透過layui.use載入模組，直接使用即可，如：
<script src="../layui/lay/dest/layui.all.js"></script>
<script>
;!function(){
//当使用了 layui.all.js，无需再执行layui.use()方法
var from = layui.form()
,layer = layui.layer;
//…
}();
</script>但你必須知道，這種使用方式，意味著Layui的模組化已經失去了它的意義。但不可否認，它比什麼都來的簡單。
更多layui知識請關注layui使用教學欄。
以上是layui入門總結的詳細內容。更多資訊請關注PHP中文網其他相關文章！
