迁移至IE11后insertRow始终将行插入首行而非末尾问题求助

这个坑我之前帮同事排查过！从IE8迁移到IE11时，insertRow()的参数处理逻辑有变化，再加上你代码里的一个小拼写错误，直接导致了这个异常。

问题根源分析 #

先看你给出的代码片段：

var table = document.getElementById(tableID); 
rowcount = table.rows.length; 
row = table.insertRow(rowCount); 

这里藏着一个变量名大小写不一致的细节：你定义的是小写c的rowcount，但调用insertRow时用的却是大写C的rowCount——这会让rowCount变成undefined。

在IE8中，浏览器做了兼容兜底，会把undefined自动识别为“插入到末尾”的指令；但IE11严格遵循W3C标准，当insertRow()的参数是undefined或者超出有效索引范围时，会默认把行插入到表格的首行（索引0的位置）。

修复方案 #

有两种可靠的解决方式，推荐第二种更通用的标准写法：

• 修正变量名拼写：保证前后变量名一致，让参数正确传递表格行数：

  var table = document.getElementById(tableID); 
  var rowcount = table.rows.length; // 加上var避免全局变量，同时统一大小写
  var row = table.insertRow(rowcount); 
  

• 使用标准写法插入到末尾：根据W3C规范，insertRow(-1)会直接将行插入到表格的最后位置，这种写法在IE11、现代浏览器甚至旧IE中都能稳定工作：

  var table = document.getElementById(tableID); 
  var row = table.insertRow(-1); 
  

额外提示 #

尽量避免依赖旧IE的非标准行为，用符合规范的写法能大幅减少跨浏览器兼容问题。另外，给变量加上var（或者ES6的let/const），避免意外创建全局变量引发其他隐性问题。

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