Question

使用javascript创建一个没有tbody的表createElement / appendChild不会在Firebug中添加tbody，但使用innerHTML会这样做。为什么？我们应该手动添加tbody吗？

Answer 1

因为tbody元素的开头和结尾标记是可选的。您可以通过直接操作DOM节点来绕过标记插入。

我们应该手动添加tbody吗？

这有点主观。

Answer 2

使用DOM创建方法时，必须假设您希望结构与创建方式一致。

如果你想在不同的浏览器中确保相同的结构，那么你应该总是手动添加它，即使JavaScript正在解析HTML。不要依赖浏览器为您插入，因为浏览器在这方面的行为可能不同。

Here's an example您可以在Firefox中运行。

首先使用此无效标记。

<p>
    <div>original</div>
</p>

解析HTML时<div>被<p>踢出，让它呈现如下......

<p>‌</p>
<div>original</div>
<p></p>

但是如果我们使用DOM方法创建相同的结构，Firefox不会进行任何更正。

var p = document.createElement('p');

p.appendChild(document.createElement('div'))
    .appendChild(document.createTextNode('new'));

document.body.appendChild(p);

所以现在生成的DOM就是这个......

<p>‌</p>
<div>original</div>
<p></p>

<p>
    <div>new</div>
</p>

所以你可以看到，即使在完全无效的结构的情况下，它也不会在你解析HTML时看到你所看到的更正。

最终，您应该做的不是依赖于常见的浏览器调整或更正，因为无法保证它们在浏览器之间是相同的。

使用结构良好且有效的HTML，您将避免出现问题。

没有自动tbody with createElement / appendChild？

2 个答案: