Javascript替换孩子？

Posted 2023-05-07

【中文标题】Javascript替换孩子？

【英文标题】：Javascript replace child?

【发布时间】：2011-06-22 05:03:50

【问题描述】：

我有一个带有几行的 html 表格。

我最初为其中一些表格行 (TR) 提供了一个 ID，然后我会使用 javascript 为其中一些表格行设置一些新的动态内容的 INNERHTML。

但是，Internet Explorer 不喜欢这样并给出“未知的运行时错误”，因为我正在尝试设置内联元素的 INNERHTML。

所以现在，我尝试用一​​个新的子行替换整个表行子行。我不能简单地 appendChild，因为我需要新的表格行与原始表格行位于相同的位置（模拟好像只是这个表格行的内容已被更改，而实际上，整行正在被“替换”）。

希望有人对此有解决方案（我在想 a）获取子位置 b）删除原始表格行和 c）在 A 中找到的子位置插入新表格行）。也许还有更简单更好的解决方案？希望有一些意见。

干杯！

【参考方案1】：

IE 不太喜欢通过innerHTML 操作表格。你可以这样做：

var oldrow = document.getElementById('the_id');
var newrow = document.createElement('tr');

// add cells to the new row
var newcell = document.createElement('td');
newcell.innerHTML = "content";
newrow.appendChild(newcell);
// ... ... ...

// Replace the old row with the new one:
oldrow.parentNode.insertBefore(newrow, oldrow);
oldrow.parentNode.removeChild(oldrow);
newrow.id = 'the_id';

---

题外话：像这样的问题是我通常建议使用 jQuery、Prototype、YUI、Closure 或 any of several others 之类的库进行平滑处理的部​​分原因超越浏览器的怪异之处，并提供 DOM 本身没有提供的其他基本功能。这让您可以专注于您正在解决的实际问题，而不是浏览器陷阱的奥秘。

【参考方案2】：

这是innerHTML，而不是INNERHTML。

【讨论】：

没错，但这不是问题所在。

【参考方案3】：

决定在当前行之后追加一个子行，并删除旧行。我能想到的最有效的方法。