Layui 简单介绍及入门

简介: Layui 简单介绍及入门

一.Layui   (国产品牌)

       1.1 Layui是什么

      用我的话来说就是  不仅拥有easyui丰富的组件库,还拥有bootstrap 的美观,嘿嘿

       layui是一套开源的 Web UI 解决方案,采用自身经典的模块化规范,并遵循原生 HTML/CSS/JS 的开发方式,极易上手,非常适合网页界面的快速开发。layui 区别于那些基于    MVVM 底层的前端框架,却并非逆道而行,而是信奉返璞归真之道。准确地说,它更多是面向后端开发者,你无需涉足前端各种工具,只需面对浏览器本身,让一切你所需要的元素与交互,从这里信手拈来。

        由国人开发(作者贤心),16年出厂的框架,该框架有个极大的好处就是定义了很多前后端交互的样式接口,如分页表格,只需在前端配置好接口,后端则按照定义好的接口规则返回数据,即可完成页面的展示,极大减少了后端人员的开发成本

          但很可惜的是,该框架早在2021年就已经宣布下线,毕竟是开源的,所有的组件都是免费的,哈哈哈,但是又田螺好人全部复制了一份,也是有这么一个网站存在,市面上也有一些公司仍在使用中.....

官方网站:https://www.layui.com/(已下线)

参考地址:在线示例 - Layui (非官网)

二.比较layui和easyui,bootstrap的区别

       2.1 layui和bootstrap的对比

      layui是国人开发的一款轻量级的框架,2016年出来,现已更新到2.x版本,样式丰富好看简单。而bootstrap  相对于来说比较成熟,现已更新到4.x版本,而且大部分的人的知道了解。

       (1).两者的适用范围不一样  。

       layui 更偏向与后端开发人员使用,在服务端页面上有很好的效果,而且layui是提供给后端开发人员最好的ui框架,是基于DOM驱动,在实现前端交互上比较麻烦,页面的DOM需要查询DOM元素。

       (2) 大小不一样

       layui 轻量级 ,而bootsrap 因为成熟,所以使用方便,但是同时也是因为成熟,就显得有些冗余

       2.2 layui和easyui对比

     1.easyui 是非开源的,有需要解决的问题的话,就只能等官方更新了

     2.layui是开源的,社区比较活跃,解决问题还是比较快的

     3.easyui诞生的早些,所以功能相对完善一些,很多功能都能是比较健全的

     4.layui就相对来说少一些了,不过,功能都是像官网说的,精雕细琢

     5.layui更符合现在的审美

三.Layui入门

1.点击那个连接进去有很多下载方法

2.下载完后得到压缩包:

3.将js文件和css文件导入,即可使用,在Layui主页面 有尝试代码

如果运行界面能弹出 一个hello world 的按钮即为 Layui没问题就可以开始工作了

四.案例

用Layui做一个注册

其实这是Layui里面都有,我们直接复制过来即可,点击表单,右边会有很多模板,自己任意挑选就行

这是我复制的·界面

代码:用的ajax写的后台就是我运用的是前面我的文章中的自定义mvc写的,主要是前台,运用了ajax传值

 

相关文章
|
7月前
|
前端开发 JavaScript Java
Layui之入门
Layui之入门
59 0
|
6月前
|
前端开发 JavaScript API
Layui的入门
Layui的入门
58 0
|
7月前
|
前端开发 JavaScript 搜索推荐
layui入门
layui入门
36 0
|
5月前
|
JavaScript 前端开发
layui使用实践总结
layui使用实践总结
45 0
|
5月前
|
前端开发 JavaScript 开发者
Layui(入门)
Layui(入门)
31 0
|
5月前
|
前端开发 JavaScript 开发者
layui01
layui01
25 0
|
6月前
|
XML 前端开发 Java
LayUI入门,以及介绍
LayUI入门,以及介绍
125 0
|
5月前
layui模块入门
layui模块入门
43 0
|
6月前
|
前端开发 JavaScript Java
LayUI入门简介(详解)
LayUI入门简介(详解)
511 0
|
7月前
|
编解码 前端开发 API
LayUI入门
LayUI入门
28 0