3
4

1 に答える 1

8

HTMLでは、どの要素を他のどの要素にネストできるかについて特定の制限があります。<div>ブラウザは、直接のなど、特定のネストシナリオから無意味なDOMを喜んで構築する場合があります<ul>。<p>また、他のブロック要素を含まない要素や、他の要素さえも含まない要素など、他の記述または非記述の解析ルールのために絶対にできない場合もあり<p>ます（これは仕様によって暗示されています）。したがって、変更して回避する必要があります。彼らが扱うことができる何かへのDOM、あなたが観察する振る舞いをもたらします。

要素を相互にネストすることはできないため<p>、ここで発生しているのは、この要素は次のとおりです。

    <p> Some line of code </p>

この他の要素を終了させて​​います：

<p>
    This is a sample paragraph with a code block:
    <code>

そこに空の<code>タグがあるので、それは<p>閉じられ、含まれているものも閉じられます。これは、後続の開始タグが前の開始<p>タグを自動的に閉じるためです。<p>

<p>
    This is a sample paragraph with a code block:
    <code> </code>
</p>

この時点で、ブラウザは、タグ<code>と<p>タグが事実上間違った順序になっているが、ネストされているという事実に対処する必要があります。最初の「outer」要素の再構築と、2番目の「inner」の前にタグ<p>が存在するという事実を補うために、2番目の要素にタグを挿入し、その内容をコードに変換します。<code><p><code><p>

<p>
    <code> Some line of code </code>
</p>

ブラウザは何らかの理由で内部を許可しているように見える<p>ため<code>（この時点で<code>はまだ明示的に）で終了していないことに注意してください</code>。ブラウザは、続行する前に、残りのDOMを次のように構築します。

<code>
    <p> Another line of code </p>
</code>

これは、レガシーおよびブラウザー間の互換性の理由から、ブラウザー間でおそらく一貫しています。これらのレガシー解析ルールの一部は、HTML5仕様のセクションにも再調整されています。残念ながら、私はブラウザの実装者ではないため、考えられるすべてのシナリオをリストすることはできません。一方、あなたが書いているマークアップがそもそも無効であることを考えると、そのような詳細に頼るのは賢明ではありません。

そして最後に、今日の非常に関連性の高いxkcd（もちろん）：

タグ

于 2012-12-07T05:38:17.983 に答える