Home >Web Front-end >Layui Tutorial >How to quote layui
How to quote layui
- 藏色散人Original
- 2021-01-19 09:17:558543browse
Layui reference method: first download layui; then introduce the two files "layui.css" and "layui.js"; finally complete the loading of the modules to be used through the "layui.use()" method. Can.
The operating environment of this tutorial: Windows 7 system, layui version 2.5.6, Dell G3 computer.
Recommendation: "layUI Tutorial"
layui is a front-end UI framework written using its own module specifications, following the writing and organizational form of native HTML/CSS/JS , the threshold is extremely low and you can use it right out of the box. It is minimalist on the outside but full on the inside. It is light in size and rich in components. Every detail from the core code to the API has been carefully crafted, making it very suitable for rapid interface development.
How to quote layui?
How to quickly introduce layui into the project after downloading it? layui is a classic modular front-end ui. Its module is based on the asynchronous module loading method implemented internally in layui.js, which is consistent with daily life. The well-known AMD specifications are different. There is a set of module loading specifications that are completely defined by layui. Through preloading, this is also the method recommended by layui officials. To introduce the downloaded source code into the project, you only need to introduce layui.css and layui. js two files, use the layui.use() method to complete the loading of the modules that need to be used.
As shown in the following example: Load layui's built-in jquery stable version and layer component
Code
<!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>Remarks:
The preloading method regardless of the code In terms of maintainability, ease of reading, and code elegance and beauty, it is better than on-demand loading to avoid confusion caused by the visible layui.use(). I have encountered users who have extremely demanding requirements on website performance and use on-demand loading. [It is not recommended to use button Required loading method], on-demand loading is prone to errors and inconvenient for later maintenance if the scope and other relationships of variables are not properly handled. Of course, in some specific cases, on-demand loading can be used with the layui.cache.xx global variable. Relatively good way;
But at the same time, it is not recommended to directly introduce layui.all.js and load it all at once (the full loading method seems to lose the meaning of layui modularization); layui's module components are preloaded through It is relatively common among larryms products.
The above is the detailed content of How to quote layui. For more information, please follow other related articles on the PHP Chinese website!