javascript - childNodes[] 在 IE9 中无法像在 IE7 和 8 中一样工作

Question

我有一些适用于 IE7 和 8 但不适用于 9 的代码

var table = document.getElementById('RadGrid_ctl01').childNodes[2];

这在 IE9 中不起作用，现在我确实读到了 IE9 计数空格等，因此索引与 IE7 和 IE8 中的不同，所以当我将索引从 2 更改为 4 时，我调试并发现相同的值像这样：

var table = document.getElementById('RadGrid_ctl01').childNodes[4];

但是，当我稍后尝试使用此代码访问表对象时

var editor = table.childNodes[i].childNodes[j].childeNodes[0]

变量编辑器将在 IE7 和 IE8 中获得预期值，但在 IE9 中它变为 null，因为 childNodes[j] 没有任何子节点。我不知道是什么原因造成的。i 和 j 都从 0 开始。

有人知道我在做什么错吗？

score 4 · Accepted Answer

IE9 的行为是正确的，低版本是错误的。问题是由两个 html-tags 之间的空格引起的，这应该导致文本节点。

更新：添加示例

<ul><li>Foo</li><li>Bar</li></ul>

<ul>
    <li>Foo</li>
    <li>Bar</li>
</ul>

看起来几乎一样，不是吗？但是生成的 DOM 不同。第一个示例将导致：

- ul
-- li
--- (text)Foo
-- li
---(text)Bar

虽然第二个标记导致了这一点：

- ul
-- (text)
-- li
--- (text)Foo
-- (text)
-- li
--- (text)Bar
-- (text)

而且由于文本节点不能有任何子节点，这会导致您的 Javascript 静默失败。

可能的解决方案

一种解决方案是去除空的文本节点。我曾经为这个问题写过一个要点。

更新：

Node.normalize()似乎是一个更可靠的解决方案，但我没有检查它的浏览器兼容性。

1 回答 1