Layui的表格

Layui的表格

代码来源于 Layui的表格
Layui用于表格的渲染方法，

Var  table = layui.table 先声明一个变量
//执行渲染
table.render({
elem: '#demo' //指定原始表格元素选择器（推荐id选择器）
,height: 315 //容器高度
,cols: [{}] //设置表头
//更多参数参考右侧目录：基本参数选项
});

这是数据表格的属性，和渲染方法
下面的是表格的设计表格头部的设计，
带有 class=“layui-table” 的

标签。
对标签设置属性 lay-data=“” 用于配置一些基础参数
在

标签中设置属性lay-data=""用于配置表头信息

   <table class="layui-table"  
    lay-data="{height:315,
     url:'/demo/table/user/', 
    page:true, id:'test'}" lay-filter="test">
    <thead>
    <tr>
    <th lay-data="{field:'id', width:80, sort: true}">ID</th>
    <th lay-data="{field:'username', width:80}">用户名</th>
    <th lay-data="{field:'sex', width:80, sort: true}">性别</th>
    <th lay-data="{field:'city'}">城市</th>
    <th lay-data="{field:'sign'}">签名</th>
    <th lay-data="{field:'experience', sort: true}">积分</th>
    <th lay-data="{field:'score', sort: true}">评分</th>
    <th lay-data="{field:'classify'}">职业</th>
    <th lay-data="{field:'wealth', sort: true}">财富</th>
    </tr>
    </thead>
    </table>

上面的代码是一个表格的头部设计