Element.getElementsByTagName出现问题

Question

我在使用Element.getElementsByTagName方法时遇到了一些麻烦。

使用以下HTML：

<p id="test">
    <p></p>
    <p></p>
</p>​

以下Javascript：

var a = document.getElementById('test');
var b = a.getElementsByTagName('p');
console.log(a);
console.log(b);​

a设置为包装段落，但b设置为空NodeList（例如：http://jsfiddle.net/xGjMN/）。

我怀疑b包含两个内部段落元素。我在这里完全误解了什么吗？

Answer 1

您无法嵌套<p>代码。

您的嵌套<p id="test"><p></p><p></p></p>呈现为：

<p id="test"></p>
<p></p>
<p></p>
<p></p> <!-- From </p> -->

因此a.getElementsByTagName('p')是一个空集合。

Answer 2

您的HTML将成为以下dom：

<p id="test"> </p>
<p/>
<p/>
<p/>

因为你无法嵌套段落。

Answer 3

P块具有某个属性，它不会将块元素放在其范围内，如果放置任何块元素（ul，li，div，p等），它将从其块中推出。

<p id="test"></p>
<p></p>
<p></p>
<p></p>

它像这样呈现出来。

如果你想计算p块，试着像这样放在div块里面

<div id="test">
    <p></p>
    <p></p>
</div>