layUI入门（1）

最新推荐文章于 2021-11-15 09:41:16 发布

jessica_567

最新推荐文章于 2021-11-15 09:41:16 发布

阅读量111

点赞数

本文链接：https://blog.csdn.net/jessica_567/article/details/103095433

版权

layUI入门（1）

这几天在学习用layui的组件，开个帖子记录一下。
下载之后运行官方的实例代码，太久没敲过代码在相对路径上还绕了不少弯子，感觉自己像个小白一样。找到一篇写相对路径比较清晰的博客src文件引入,算是解决了我的问题。
修改之后的实例代码如下:

<!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="layui/css/layui.css">
</head>
<body>
 
<!-- 你的HTML代码 -->
 
<script src="layui/layui.js"></script>
<script>
//一般直接写在一个js文件中
layui.use(['layer', 'form'], function(){
  var layer = layui.layer
  ,form = layui.form;
  
  layer.msg('Hello World');
});
</script> 
</body>
</html>

路径的设置是这样的,官方实例里的href和src都要改成你自己的相对位置。
代码写在了index里面
link单词的意思是链接，即引入外部文件。
rel是关联的意思，关联的是一个样式表(stylesheet)文档，关于“rel=stylesheet”的作用
href是链接的css文件名字。
layui.use是对layui模块的使用，官方文档这这样写的：

//layui模块的定义
layui.define([mods], function(exports){
  
  //……
  
  exports('mod', api);
});  
 
//layui模块的使用
layui.use(['mod1', 'mod2'], function(args){
  var mod = layui.mod1;
  
  //……
  
});

更多的可以参考layui的官方文档

jessica_567

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
layUI入门（1）

layUI入门（1）这几天在学习用layui的组件，开个帖子记录一下。下载之后运行官方的实例代码，太久没敲过代码在相对路径上还绕了不少弯子，感觉自己像个小白一样。找到一篇写相对路径比较清晰的博客src文件引入,算是解决了我的问题。修改之后的实例代码如下:<!DOCTYPE html><html><head> <meta charset="u...
复制链接

扫一扫