JavaScript onclick事件报错：无法读取undefined的rows属性求解决建议

开发onclick事件时触发错误：未捕获类型错误：无法读取undefined的属性（读取‘rows’），相关代码片段：

if (obj.parentElement.rowIndex!=0) {
    sTable=obj.parentElement.parentElement.parentElement.id
    objinitable = eval("document.all.ini" + sTable.substr(3))
    objrectable = eval("document.all.rec" + sTable.substr(3))

    sParameters = objinitable.rows(0).cells(obj.cellIndex).innerText
    aParameters =sParameters.split("/")
    sfunction=aParameters[4]
}

排查与修复建议 #

• 定位objinitable为undefined的核心原因
  错误出在objinitable.rows(0)，说明objinitable未获取到目标元素，根源是老旧的eval+document.all写法不可靠，且拼接的元素ID可能有误：

  • 先打印sTable和sTable.substr(3)的值，确认拼接后的ID（如iniXXX）是否和页面中实际存在的表格ID一致。
  • 替换老旧写法为标准DOM获取方式，避免eval的安全和性能问题：

    const tableSuffix = sTable.substr(3);
    objinitable = document.getElementById(`ini${tableSuffix}`);
    objrectable = document.getElementById(`rec${tableSuffix}`);
    

• 修正DOM层级获取逻辑
  obj.parentElement.parentElement.parentElement.id硬写三层父元素极易出错，一旦DOM结构变动就会失效，换成动态查找表格的方式：

  let currentEl = obj;
  while (currentEl && currentEl.tagName !== 'TABLE') {
      currentEl = currentEl.parentElement;
  }
  if (!currentEl) return; // 未找到表格时直接终止，避免后续报错
  sTable = currentEl.id;
  

• 添加存在性检查与语法修正
  在访问rows前先验证元素是否存在，同时注意rows/cells是HTMLCollection，需用方括号[]访问索引而非圆括号()：

  if (!objinitable) {
      console.error('未找到对应ini开头的表格元素');
      return;
  }
  // 修正索引访问方式
  sParameters = objinitable.rows[0].cells[obj.cellIndex].innerText;
  

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