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 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>