layui 怎么引用-木庄网络博客

本文摘自PHP中文网，作者藏色散人，侵删。

layui的引用方法：首先下载layui；然后通过引入“layui.css”和“layui.js”两个文件；最后通过“layui.use()”方法完成需要使用的模块加载即可。

本教程操作环境：Windows7系统、layui2.5.6版，Dell G3电脑。

推荐：《layUI教程》

layui是一款采用自身模块规范编写的前端 UI 框架，遵循原生 HTML/CSS/JS 的书写与组织形式，门槛极低，拿来即用。其外在极简，却又不失饱满的内在，体积轻盈，组件丰盈，从核心代码到 API 的每一处细节都经过精心雕琢，非常适合界面的快速开发。

layui怎么引用？

在下载layui后如何快速将其引入至项目中，layui是一款经典模块化前端ui，它的模块是基于 layui.js 内部实现的异步模块加载方式，与日常所熟知的AMD 规范有所区别，有一套完全属于layui定义的模块加载规范，通过预加载方式，这也是layui官方所推荐的方式，将下载到的源码引入项目只需要引入layui.css和layui.js两个文件，通过layui.use()方法完成需要使用的模块加载。

如下示例所示：加载layui内置的jquery稳定版本和layer组件

代码

<!DOCTYPE html>
<html>
<head>
     <meta charset="UTF-8">
     <title>Document</title>
     <link rel="stylesheet" href="layui/css/layui.css">
     <!-- your css link -->
</head>
<body>
     <!-- you html code -->
     <script type="text/javascript" src="layui/layui.js"></script>
     <script>
     layui.use(['jquery','layer'],function(){
       
        var $ = layui.$,
        layer = layui.layer;
        #your js coding
     });
     </script>
</body>
</html>

备注：

预加载的方式无论从代码可维护度、阅读便利以及代码优雅美观方面是要强于按需加载避免随从可见的layui.use()造成混乱，曾遇到过对网站性能的极致苛求用户使用按需加载方式【不推荐使用按需加载方式】，按需加载如果对变量的作用域等关系处理不当也容易出现错误且不便于后期维护，当然在某些特定的情况下可以配合layui.cache.xx全局变量使用按需加载也是相对较好的方式；

但同时也不建议直接引入 layui.all.js一次性全加载（全加载方式似乎失去了layui模块化的意义）； layui的模块组件通过预加载方式在larryms的产品中是比较常见的。

以上就是layui 怎么引用的详细内容，更多文章请关注木庄网络博客！