表标签不嵌套在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 或强或小 ... 米 < / p>

该列表中没有<table>。

因此，您尝试插入无效的HTML，并且浏览器正在将<p><table></table></p>更改为<p></p><table></table>（即将桌子移动到兄弟姐妹中）以获得有效的HTML。

如果您为浏览器提供无效的HTML，浏览器将猜测您的真实含义并继续猜测。

Answer 2

这是因为<p>和<table>都是块级元素。

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

祝你好运！ ：）