关于javascript:innerHTML append in IE9


innerHTML append in IE9

我有一个页面，它只是尝试在 javascript 函数中执行以下操作：

1
2
3
document.getElementById("chatTable").innerHTML +="<tr><td colspan="3">      a??
    <span color="purple">------------Switched to channel:" + channelName +  a??
   "------------</span></td></tr>";

这适用于我尝试过的所有其他浏览器(Firefox、Chrome、Safari、Android 手机浏览器、iPhone 浏览器)，但不适用于 IE9。是的，我确实有一个 ID 为 chatTable 的表，并且确实设置了 channelName 变量。我知道我实际上可以使用 DOM 为表对象附加一个表行(我认为它的 insertRow() 或其他东西)，但现在它已经成为一个原则问题，它让我发疯了。我尝试将 += 更改为 = 并且没有运气。我还尝试在javascript中将表格设置为自己的变量，然后尝试编辑innerHTML，但仍然没有运气。哦，我确实有：

1
<!DOCTYPE HTML>

在我的页面中。我做错了什么？！

相关讨论

您不能将 .innerHTML 或 .outerHTML 与以下任何元素一起使用：COL、COLGROUP、FRAMESET、HTML、STYLE、TABLE、TBODY、TFOOT、THEAD、TITLE 或 TR。

请参阅动态构建表以使用 Microsoft 的表对象模型在 Internet Explorer 中操作表。

我想这可能会在 IE 的未来版本中发生变化，但这是你现在所剩下的。

相关讨论

除了 Jim 的回答之外，当您附加 HTML 时，您会破坏并重建现有表。即使在允许您这样做的浏览器中，添加行的通常更好的解决方案是：

1
2
3
4
5
6
7
8
9
10
11
var table = document.getElementById("chatTable"),
    row = table.insertRow(-1), //-1 means at end
    cell = row.insertCell(0),
    span = document.createElement("span");

span.style.color ="purple";
span.appendChild(document.createTextNode("------------Switched to channel:" + channelName +"------------"));
cell.colSpan = 3;
cell.appendChild(span);
row.appendChild(cell);
table.appendChild(row);

它通常更快，并且您不会丢失任何已附加到表中的事物的现有事件处理程序。

相关讨论