十四、bootstrap-table 展示数据

最新推荐文章于 2025-06-03 09:10:05 发布

ssshen14

最新推荐文章于 2025-06-03 09:10:05 发布

阅读量4.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： python建个网站文章标签： bootstrap-table

本文链接：https://blog.youkuaiyun.com/ssshen14/article/details/77771145

最开始使用js拼接成table中的行，追加到table上，来实现数据的展示，需要写好多之类的html标签，不美观，而且也不便于维护；后期改用bootstrap-table实现数据的展示和加载，一下子就从繁琐的html拼接中解放出来了，github地址：https://github.com/wenzhixin/bootstrap-table

bootstrap-table支持导出、查找、隐藏列，还可以添加toolbar 结合js实现自己定制化的功能，简直是前端表格展示的福音。

html：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" src="/static/js/jquery-2.1.0.js"></script>
    <script type="text/javascript" src="/static/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/static/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/css/bootstrap-table.css">
    <script type="text/javascript" src="/static/js/bootstrap-table.js"></script>
    <script type="text/javascript" src="/static/js/json2.js"></