模板引擎填表单需防xss并正确处理布尔属性：value用转义插值，checked/selected用条件渲染；后端传参应结构化且避免布尔陷阱；csrf token须作为未转义hidden字段嵌入form内。
模板引擎里怎么填表单的 value 和 checked
直接写死 HTML 的表单没意义，关键是怎么把后端数据或 JS 变量塞进 input、select、textarea 里。不同模板引擎处理方式差异大，但核心就两条：字符串插值要防 XSS，布尔属性（比如 checked、selected）不能靠“有值即真”。
- 用
{{ value }}填input value时，确保模板引擎默认做了 HTML 转义；如果没做，得显式调用{{ value|escape }}或类似过滤器，否则用户输入<script></script>就执行了 -
checkbox和radio的checked属性不是写checked="{{ bool }}"—— 浏览器只认有没有这个属性，不看值。正确写法是条件渲染：{% if user.agree %}checked{% endif %}（Jinja2）或<input type="checkbox">（Handlebars） -
select的option选中靠selected属性，同样不能写selected="{{ item.id == selected_id }}"，得用条件包裹整个selected字符串
Post 提交后表单回显：后端怎么传数据给模板
用户填错提交，服务端校验失败，得把原数据连同错误信息一起返回模板。这时候传参结构直接影响模板写法是否干净。
- 别只传一个
request.form对象，它可能含恶意字段或缺失默认值。应该构造明确的数据结构，比如{'form': {'username': '', 'email': request.form.get('email', ''), 'role': 'user'}, 'errors': {'email': '邮箱格式不对'}} - 如果模板引擎支持，优先用对象属性访问（
form.email），别用字典键访问（form['email']），前者在字段不存在时更静默，后者容易报错中断渲染 - 注意空字符串、
None、0在布尔上下文里的表现——比如if form.age会把0当 false，导致年龄为 0 的用户表单清空，应改用if form.age is not None
前端 JS 动态更新模板渲染的表单值
纯模板渲染是静态快照，一旦页面加载完成，再想用 JS 改 input.value，模板变量本身不会变，但 DOM 已经脱离模板控制。这时候要小心“双写”问题。
- 不要在 JS 里直接操作
input.value = data.name后，还指望下次模板重渲染能覆盖它——除非你手动清空或重建整个表单 DOM - 如果用 Vue/React 这类响应式框架，模板引擎就该退场了，前后端分离场景下，模板引擎只负责首屏骨架，表单交互全交给前端框架管理状态
- 若必须混合使用（比如 Django + 少量 jQuery），JS 更新值后，记得同步更新对应的数据源（如
data-form-value自定义属性），否则提交时取的还是旧 DOM 值或原始模板值
CSRF token 怎么安全塞进模板表单
几乎所有现代 Web 框架都要求表单带 CSRF token，但它不是普通字段，放错位置或编码方式会导致验证失败。
立即学习“前端免费学习笔记（深入）”；
- token 必须作为
input type="hidden"放在form标签内，且 name 固定（如csrf_token），不能用变量名拼接，也不能放在form外面 - 模板里插入时，确保它没被二次转义——比如 Jinja2 的
{{ csrf_token|safe }}或 EJS 的，用{{ }}默认转义会把 token 里的=、+等变成 HTML 实体，后端收不到原值 - 如果用了 CDN 或静态资源代理，注意不要缓存带 token 的 HTML 片段，否则多个用户拿到同一个 token，验证必失败
事情说清了就结束。最常出问题的不是语法，而是「以为模板变量能自动同步 DOM」和「把 token 当普通字符串随便插」。
