1

HTML：

<div class="a">
    <p><p class="y"><p class="z"></p></p></p>
</div>

コード：

        console.log(document.getElementsByClassName('z')[0].parentNode)

div.aを返します

みんなを助けて、なぜそれがスキップするのか

?? ところで、pyをdiv.yに変更すると、div.yが返されます。

4

4 に答える 4

6

無効なhtmlは、スキップする理由です。段落に段落を含めることはできません。

HTML 4.01仕様：9.3.1段落：P要素

P要素は段落を表します。ブロックレベルの要素（P自体を含む）を含めることはできません。

コンソールでHTMLを調べると、ブラウザがhtmlを書き換えて最初の段落タグを閉じることがわかります。これはブラウザがレンダリングするものです：

<div class="a">
    <p></p>
    <p class="y"></p>
    <p class="z"></p>
    <p></p>
    <p></p>
</div>
于 2013-02-01T14:46:31.737 に答える
4

A<p>は別のの親になることはできません<p>。各<p>タグは、次のタグの開始時に暗黙的に終了します。終了タグは無視されます。

このように機能する他のタグもあります：<td>そして<li>頭に浮かぶ。（さまざまな理由がありますが、理由はマークアップの外観に同様の影響を及ぼします。）

于 2013-02-01T14:46:23.917 に答える
2

HTMLが無効です。要素を別の要素pの子にすることはできず、p要素の終了タグpはオプションです。

したがって、HTMLは次のように解釈されます。

<div class="a">
    <p></p>
    <p class="y"></p>
    <p class="z"></p>
    <!-- unexpected and therefore ignored </p> -->
    <!-- unexpected and therefore ignored </p> -->
</div>

親ノードは無視されていません。作成しているHTMLは、想定しているDOMを生成していません。

于 2013-02-01T14:47:03.997 に答える
1

段落タグ<p>は、HTMLの特殊なケースです。以下は完全に有効なhtmlでした：

<p>this is a paragraph
<p>This is another paragraph, but notice I never closed the first one
<p>a third paragraph, also following another non-closed para
<p>a fourth one</p>

前の段落を閉じずに新しい段落を開始すると、前の段落を暗黙的に閉じます。これは、段落を相互にネストできないことを意味します。

于 2013-02-01T14:47:16.887 に答える