JavaScript for循环中能否将元素ID名称作为变量使用

JavaScript 完全支持在for循环内动态拼接元素ID传入DOM选择方法，这是优化重复DOM操作的常规实现方案，完全可以替代你当前代码里大量冗余的if判断逻辑。

• 重复逻辑冗余：15条if判断逻辑完全一致，仅目标ID不同，无任何编写必要
• 存在手写笔误：i=9时重复给两个隐藏域赋值、i=10和i=11同时给HiddenField11赋值，会导致赋值结果错乱
• 存在不必要的性能损耗：循环内重复调用document.getElementById("table")查询同一个DOM元素
• 赋值逻辑隐患：HiddenField类隐藏域属于表单控件，正常赋值需要使用value属性，innerHTML对表单输入类元素不生效

// 提前缓存表格DOM，避免循环内重复查询
const tblFruits2 = document.getElementById("table");
const chks2 = tblFruits2.getElementsByTagName("INPUT");

// 循环初始值i=1对应跳过表头行，可根据业务实际调整初始值
for (let i = 1; i < chks2.length + 1; i++) {
  const cellContent = tblFruits2.rows[i].cells[2].innerHTML;
  // 动态拼接目标元素ID
  const targetEl = document.getElementById(`HiddenField${i}`);
  // 增加存在性校验，避免元素不存在时抛出JS错误中断逻辑
  if (targetEl) {
    // 表单隐藏域用value赋值，普通容器元素可替换为innerHTML
    targetEl.value = cellContent;
  }
}

• 动态拼接ID的核心逻辑是通过字符串拼接生成目标选择器：
  • 支持ES6的环境可以直接用模板字符串写法 `HiddenField${i}`
  • 需要兼容老旧浏览器的环境可以替换为传统字符串拼接写法：'HiddenField' + i，两种写法效果完全一致
• 如果你的业务中行索引和隐藏域ID序号存在固定偏移，只需要调整拼接时的数值计算即可，比如第一行（i=1）对应HiddenField0时，直接写成`HiddenField${i-1}`即可
• 增加的元素存在性校验可以避免个别ID缺失时整个脚本崩溃，稳定性更高

内容的提问来源于stack exchange，提问作者Computer knowledge