在模板引擎中动态设置 html 元素的 name 属性时，需确保模板变量被正确包裹在英文双引号内，否则浏览器无法识别该属性，javascript 也无法通过选择器（如 $("[name='updatedt']")）定位元素。上述问题的根本原因正是遗漏了引号，导致生成的 html 类似 <dd name=id> —— 浏览器将其视为无值属性或非法语法，实际不渲染 name 值。
以下是修正后的完整模板代码示例：
[% FOREACH field IN ['id','type','updatedt','lastcheckdt'] %]
<div class="row col-md-3 col-sm-6">
<dl class="details-dl">
<label>[% field %]</label>
<div class="details-dg">
<dd name="[% field %]" class="float-right">[% order.$field %]</dd>
</div>
</dl>
</div>
[% END %]关键修改点：
✅ <dd name="[% field %]" ...> —— 双引号包裹模板变量，确保输出为 <dd name="updatedt">...</dd>；
❌ <dd name=[% field %] ...> —— 缺少引号，易被解析为 <dd name=id>，name 属性值丢失。
随后，JavaScript 即可正常操作对应元素：
// 正确获取并格式化时间字段
let dt_formatted = convertDateFormat("[% order.updatedt %]");
$("[name='updatedt']").text(dt_formatted); // 注意：dd 是标签，用 .text() 而非 .val()
// 同理可操作其他字段
$("[name='id']").text("[% order.id %]");⚠️ 注意事项：
- <dd> 是块级内容标签，不支持 value 属性，因此应使用 .text() 或 .html() 更新内容，而非 .val()；
- 若后续需提交表单，name 属性对 <dd> 无效（仅表单控件如 <input>、<select> 等才参与表单提交），如需数据提交，请改用隐藏输入框或调整语义结构；
- 模板变量插值必须严格位于引号内，且避免空格或特殊字符未转义（如 field 值含单引号时，推荐统一用双引号包裹）。
总结：模板中动态属性值 = 引号 + 模板语法，这是保障 HTML 结构合法与 JS 可交互的基础前提。
立即学习“前端免费学习笔记（深入）”；
