怎么利用layui美化table数据表格-木庄网络博客

2022-03-11 20:24:20 PHP中文网 JavaScript 百度已收录

本文摘自PHP中文网，作者V，侵删。

首先我们来看下美化后的效果图：

（学习视频分享：html视频教程）

具体步骤：

1、引入layui的css和js文件

1 2	`<link` `rel="stylesheet"` `href="lib/layui/css/layui.css">` `<script` `src="lib/layui/layui.js"></script>`

2、在页面放置一个table元素

1	`<table` `class="layui-hide"` `id="test"` `lay-filter='test3'></table>`

3、通过 table.render() 方法指定该容器

4、这个时候你的页面差不多就是以下这个样子了

5、正文到了，怎么把表格数据渲染进去呢？咱们上面第三部就是渲染的一中方法，叫“方法渲染”，layui官网提供的三种渲染方法，在这里不做陈述，方法渲染的优点是：你可以脱离HTML文件，而专注于JS本身。尤其对于项目的频繁改动及发布，其便捷性会体现得更为明显，layui的url默认是“get”请求，我这边是post请求，所以记得加上“method”属性为post。

6、容易碰到的问题，按理来说这个时候应该已经可以看到表格数据了，为什么大多数人的表格还是渲染不出来呢？一般是因为你没配置后台数据格式

相关阅读 >>

html table表格是什么？<table>标签中各种属性的使用方法

layui时间控件闪退的问题介绍

对于layui框架源码兼容性微调介绍