javascript - 如果我们将 div 放在 p 标签内，Jquery html() 方法不起作用？

Question

这是我的 HTML:

  <div class="accor">
  </div>
  <div class="accordionContentTwoCol">
   <p class="noEdit">
     <div>   name : </div>
  </p>
 <div>

我需要找到 accordionContentTwoCol div 的 html 内容(我只能访问 accor)。
如果我尝试像这样在 accordionContentTwoCol div 中打印 html:

alert("html inside accordionContentTwoCol :"+$('.accor').next().html());

输出如下:

尽管 accordionContentTwoCol 中的 HTML 是:

<p class="noEdit">
         <div>   name : </div>
</p>

为什么会这样？

Answer 1

查找允许的包含关系的权威位置是 HTML 规范。参见，例如，http://www.w3.org/TR/html4/sgml/dtd.html .它指定哪些元素是 block 元素，哪些是内联元素。对于这些列表，搜索标记为“HTML 内容模型”的部分。

对于P元素，它指定了如下内容，表示P元素只允许包含行内元素。

<!ELEMENT P - O (%inline;)*            -- paragraph -->

这与http://www.w3.org/TR/html401/struct/text.html#h-9.3.1一致，它表示 P 元素“不能包含 block 级元素(包括 P 本身)。”

Why <p> tag can't contain <div> tag inside it?