在 jinja2 模板中，`{% set %}` 定义的变量具有块级作用域，若在 `if-else` 内部赋值，外部无法访问，导致 `{{ bg_color }}` 报错；应改用单行条件表达式或改用 css `:nth-child()` 实现奇偶交替样式。
Jinja2 的变量作用域规则常被初学者忽略：在 {% if %}...{% else %}...{% endif %} 块内通过 {% set bg_color = '...' %} 声明的变量，仅在该块内部有效。因此，当模板执行到 background-color: {{ bg_color }} 时，该变量已超出作用域，Jinja2 会报 undefined variable 错误（如 jinja2.exceptions.UndefinedError）。
✅ 正确做法是将变量声明提升至循环体顶层，并使用 Jinja2 的内联条件表达式（ternary-like syntax）：
{% for comment in comments %} {% set bg_color = '#e6f9ff' if loop.index % 2 == 0 else '#eee' %}{% endfor %}#{{ loop.index }}
{{ comment }}
? 注意：loop.index 从 1 开始计数（即第 1 条为奇数），因此 loop.index % 2 == 0 对应偶数项（如第 2、4、6 条），匹配蓝色 #e6f9ff；其余为灰色 #eee。
⚠️ 更推荐的工程化方案：完全交由 CSS 处理样式逻辑，既语义清晰、性能更优，又避免模板中混杂样式逻辑：
? 优势说明：
- ✅ 作用域无忧：无需在模板中管理变量生命周期；
- ✅ 可维护性强：样式集中于
- ✅ 语义更佳：HTML 专注结构，CSS 专注表现；
- ✅ 兼容性好：nth-child 在现代浏览器中广泛支持（包括所有 Flask 默认适配的前端环境）。
? 小结：Jinja2 不是 JavaScript，其变量不具备函数/块外提升特性。遇到类似问题，优先考虑——
① 是否可通过内联表达式简化变量声明；
② 是否更适合交由 CSS（如 :nth-child, :nth-of-type）或前端框架处理；
③ 避免在模板中编写复杂逻辑，保持视图层轻量、可测试、易协作。
#{{ loop.index }}
{{ comment }}