Question

我只是编写了一些代码来遍历DOM的表格，我得到了一个惊喜。 DOM（至少在FF中）不是我所期望的。 FF已插入tbody和各种文本节点，其中只包含“\ n”。源HTML是：

<table>
<tr>
<th></th><th>Jan</th><th>Feb</th><th>Mar</th><th>Apr</th><th>May</th><th>Jun</th><th>Jul</th><th>Aug</th><th>Sep</th><th>Oct</th><th>Nov</th><th>Dec</th>
</tr>
<tr><th>2010</th>
<td id='tdid0'>53</td>   <td id='tdid1'>249</td>  <td id='tdid2'>1689</td>  <td id='tdid3'>22753</td>
<td id='tdid4'>23051</td><td id='tdid5'>23633</td><td id='tdid6'>23923</td> <td id='tdid7'>23306</td>
<td id='tdid8'>23943</td><td id='tdid9'>24196</td><td id='tdid10'>24440</td><td id='tdid11'>24156</td>
</tr>
<tr><th>2011</th>
<td id='tdid12'>24262</td><td id='tdid13'>22554</td><td id='tdid14'>25507</td><td id='tdid15'>23144</td>
<td id='tdid16'>24354</td><td id='tdid17'>24610</td><td id='tdid18'>24870</td><td id='tdid19'>24424</td>
<td id='tdid20'>24698</td><td id='tdid21'>22640</td><td></td><td></td></tr>
</table>

1 - FF已插入tbody作为table的第一个孩子，所以我必须上升3级（来自td）才能找到table }，而不是2

2 - Firebug中的html视图按预期显示3行，其中第2行和第3行的th后跟12 td s。但是，单步执行时，tbody有6个子节点，每行后面有一个NL文本节点

3 - Firebug声称每行有13个孩子，正如预期的那样（一个标题和12个数据项）。但是，当使用nextSibling单步执行子项时，事实证明，预期的th和td元素实际上由包含WS的文本节点分隔。知道发生了什么事吗？浏览器可以基本上做它想要的吗？感谢。

Answer 1

FF插入了一个tbody

在HTML 4中，tr元素可能不是表元素的子元素。你需要一个tbody，thead或tfoot元素。但是tbody元素的开始和结束标记是可选的。 Firefox正确插入它。

事实证明，tbody有6个子节点，每行后面有一个NL文本节点

标记中有空格

事实证明，预期的th和td元素实际上是由文本节点分隔的，包含WS

同上

HTML表的DOM表示

1 个答案: