1、了解python 主流的web框架

（1）Django：简单来说就是重武器，是最全能的开发框架，你想要的功能它都有；但是比较繁重，适合企业级的web开发；

（2）Flask：属于web开发微框架，小巧灵活，相关的第三方库丰富，适合开发小型web；

（3）Tornado：天生异步，性能强悍，但是框架提供的功能少，需要开发者自己实现；

因此，本文代码实现主要是基于Flask实现的。

2、了解Flask框架

（1）HelloWorld实现：

几乎所有的编程都是基于“hello world”实现的，因此也大致讲下helloworld涉及的内容。

from flask import Flask
app = Flask(__name__)
 
@app.route('/')
def hello_world():
    return "Hello world!"
 
if __name__ == '__main__':
    app.run()

** 注意： **
** 注意： **
** 注意： **
先声明一个Flask框架的对象，然后定义路由’/’，即URL地址为 http://127.0.0.1:5000/；如果定义路径为‘/index’，那对应的访问地址需要改为http://127.0.0.1:5000/index。另外，@app.route是个装饰器。

（2）如何实现具体IP地址或者端口的访问呢？

app.run(debug=True,host="x.x.x.x",port="1234")

通过对app.run()方法的参数定义，分别实现了调试功能，访问URL变更为 http://x.x.x.x:1234

这里调试功能还是很好用的，不但可以帮助开发者重新加载网页，而且会打印详细的错误信息，协助定位。

（3）如何在web上显示自己特定的html模板

from flask import Flask,render_template
app = Flask(__name__)
 
@app.route('/')
def hello_world():
    return render_template('test.html')
 
if __name__ == '__main__':
    app.run()

只需要导入render_template库，并且在函数返回时改成对应的方法即可。

不过 这 里要 注意，test.html必须保存在工程目录与下template文件下，否则会报错。（这是因为render_template方法定义时默认写了template路径 ）

3、表格创建

（1）html表格编写

 <div class="column" style="background: blue;font-size: 18px">
          <h1 style="height: 20px;text-align: center;color: white">详细信息</h1>
          <table border="1" cellpadding="0" cellspacing="0" bordercolor="#FFFFFFF" style="height: 10px;border-collapse:collapse;">
            <tr>
                {% for i in labels %}
                    <td><b>{
   { i }}</b></td>
                {% endfor %}
            </tr>
            {% for i in content %}
                <tr>
                    {% for j in i %}
                        <td><b>{
   { j }}</b></td>
                    {% endfor %}
                </tr>
            {% endfor %}
          </table>
      </div>

（2）APP.py数据上传处理

from flask import Flask, render_template, Response
data = “这里的数据大家自己创建一个二维list就可以“
app = Flask(__name__)
@app.route('/')
def index():
    content = data[['detail_id' ,'order_id' ,'dishes_id']][:100]
    labels = ['detail_id' ,'order_id' ,'dishes_id']
    return render_template("index.html",content=content,labels =labels)
if __name__ == '__main__':
    app.run()

（3）结果

熟悉这段代码后，我觉得有几块内容是和我要实现的代码有关的。

（1）title 标题修改

（2）表格的长宽大小：

（3）设置表格的ID：<table class=“table table-striped table-bordered table-hover”，id=“test”>。这里其实不设置id也是可以的，但是后续我要对表格进行编辑时，加上id会方便我定位表格，方法是：tab = document.getElementById(“test”)

针对这个表格数据，我们可以连接数据库，实现数据的实时交互！

希望这个对您有用；
谢谢点赞评论！