本文介绍如何在 flask 中基于数据库查询结果自动渲染任意行数的 html 表格，无需手动编写重复标签，通过 jinja2 模板引擎实现数据驱动的表格生成。

在 Web 开发中，将数据库查询结果（如 50 行、500 行甚至更多）以表格形式展示在网页上，是常见需求。手动为每行写

python学习

Python 编程学习助手 skill，面向零基础用户。 当用户表达以下意图时触发： - 学习 Python 基础概念（变量、数据类型、循环、函数、类等） - 请求 Python 练习题或测验 - 请求审查或调试 Python 代码 - 请求 Python 项目实战指导（爬虫、数据分析、Web 开发等入门项目） - 泛化表述如"教我 Python""我想学编程""Python 怎么写""帮我学 Python" 此 skill

下载

... 显然不可扩展，也不符合现代 Web 开发实践。Flask 内置的 Jinja2 模板引擎正是为此类动态内容而设计——它支持逻辑控制、循环与变量插值，能轻松将 Python 数据结构（如列表、字典）映射为 HTML 结构。

✅ 核心实现三步法

1. 后端：查询数据并传入模板
   在 Flask 路由中，使用 SQLAlchemy、sqlite3 或其他数据库驱动获取数据，并以列表形式（如 list[dict]）传递给模板：

from flask import Flask, render_template
import sqlite3

app = Flask(__name__)

@app.route('/')
def show_table():
    # 示例：从 SQLite 查询所有用户
    conn = sqlite3.connect('example.db')
    conn.row_factory = sqlite3.Row  # 支持按列名访问
    cur = conn.cursor()
    cur.execute("SELECT id, name, age FROM users")
    rows = [dict(row) for row in cur.fetchall()]  # 转为字典列表，便于模板使用
    conn.close()

    return render_template('table.html', rows=rows)

2. 前端：Jinja2 模板中动态渲染表格
   在 templates/table.html 中，使用 {% for %} 循环遍历 rows，自动生成 和 。表头（ ）固定定义，内容区（ ）由数据驱动：

   <!DOCTYPE html>
   <html>
   <head>
       <title>动态用户表格</title>
       <style>
           table { border-collapse: collapse; width: 100%; margin-top: 1rem; }
           th, td { border: 1px solid #333; padding: 8px 12px; text-align: left; }
           th { background-color: #f2f2f2; font-weight: 600; }
           tr:nth-child(even) { background-color: #f9f9f9; }
       </style>
   </head>
   <body>
       <h2>用户数据表（共 {{ rows|length }} 条记录）</h2>
       <table>
           <thead>
               <tr>
                   <th>ID</th>
                   <th>姓名</th>
                   <th>年龄</th>
               </tr>
           </thead>
           <tbody>
               {% if rows %}
                   {% for row in rows %}
                   <tr>
                       <td>{{ row.id }}</td>
                       <td>{{ row.name | default('N/A') }}</td>
                       <td>{{ row.age or '未知' }}</td>
                   </tr>
                   {% endfor %}
               {% else %}
                   <tr>
                       <td colspan="3" style="text-align:center; color:#666;">暂无数据</td>
                   </tr>
               {% endif %}
           </tbody>
       </table>
   </body>
   </html>

   ? 提示：{{ row.name | default('N/A') }} 使用 Jinja2 过滤器处理可能的空值，增强健壮性；colspan="3" 确保空状态提示横跨全部列。

   3. 进阶建议（可选但推荐）
   • ✅ 分页优化：若数据量极大（如上万行），应在后端加 LIMIT/OFFSET 或使用 paginate()（SQLAlchemy），避免前端卡顿；
   • ✅ 响应式支持：为表格添加 overflow-x: auto 容器或使用 Bootstrap 表格类提升移动端体验；
   • ✅ 安全防护：Jinja2 默认转义变量输出（防止 XSS），但若需渲染 HTML 内容，请显式使用 |safe 过滤器，并确保来源可信。

   ✅ 总结

   Flask + Jinja2 的组合让「数据库 → 动态表格」变得简洁可靠：你只需关注数据获取逻辑与模板结构，无需手写千行 HTML。只要数据以标准 Python 容器（如 list[dict]）形式传入，Jinja2 就能高效、安全、可读地完成渲染。这是服务端动态网页开发的标准范式，也是 Flask “轻量但完整” 设计哲学的典型体现。