HTML 中如何正确使用模板变量动态设置元素 name 属性
发表时间：2025-12-31 00:00:00
文章作者：碧海醫心
浏览次数：
在模板引擎中动态设置 html 元素的 name 属性时，需确保模板变量被正确包裹在英文双引号内，否则浏览器无法识别该属性，javascript 也无法
通过选择器（如 $("[name='updatedt']")）定位元素。上述问题的根本原因正是遗漏了引号，导致生成的 html 类似
以下是修正后的完整模板代码示例：
[% FOREACH field IN ['id','type','updatedt','lastcheckdt'] %]
- [% order.$field %]
关键修改点：
✅
❌
随后，JavaScript 即可正常操作对应元素：
// 正确获取并格式化时间字段
let dt_formatted = convertDateFormat("[% order.updatedt %]");
$("[name='updatedt']").text(dt_formatted); // 注意：dd 是标签，用 .text() 而非 .val()
// 同理可操作其他字段
$("[name='id']").text("[% order.id %]");⚠️ 注意事项：
- 是块级内容标签，不支持 value 属性，因此应使用 .text() 或 .html() 更新内容，而非 .val()；
- 若后续需提交表单，name 属性对
- 无效（仅表单控件如 、
- 模板变量插值必须严格位于引号内，且避免空格或特殊字符未转义（如 field 值含单引号时，推荐统一用双引号包裹）。
总结：模板中动态属性值 = 引号 + 模板语法，这是保障 HTML 结构合法与 JS 可交互的基础前提。
立即学习“前端免费学习笔记（深入）”；
