表格標籤不嵌套在DOM中的P標籤內

Question

我一直在播放對innerHTML內容的動態更改，並注意到一些嵌套在其他元素內的表的奇怪行爲。

例如，表格p/p p table/table/p/form沒有將該表格視爲第二個p的innerHTML，而是將該表格列爲該p標記的同級而不是孩子。

我想這是一個衆所周知的行爲。

我的知識有什麼差距？

TIA

Answer 1

你不能把一個<table>一個<p>內。從HTML4 specification：

<!ELEMENT P - O (%inline;)* -- paragraph -->
[...]
它不能包含塊級元素（包括P個本身）。

，然後如果你看一下%inline; elements are，你不會在列表中找到<table>。

而對於HTML5，<p> can contain phrasing content：

允許內容

措詞內容

而且phrasing content是字符數據和phrasing elements，措辭元件是：

一個或EM或強或小 ...米

有沒有在該列表中沒有<table>。

因此，您試圖插入無效的HTML，並且瀏覽器將<p><table></table></p>更改爲<p></p><table></table>（即將表格子項移至同級）以獲取有效的HTML。

如果你給瀏覽器提供了無效的HTML，瀏覽器會猜測你的真實含義並猜測它。

Answer 2

這是因爲<p>和<table>都是塊級元素。

使用表格的容器元素，如<div>。

祝你好運！ :)