html dom问题，如何获取p标签的高度？答案

【问题标题】：Problem with html dom, how to get the height of p tag?html dom问题，如何获取p标签的高度？
【发布时间】：2010-11-09 01:05:56
【问题描述】：

假设我们有以下代码：

    <html>
    <head>
    </head>
    <body>
    <p id="paragraph">
    <h1>HELLO</h1>
    dfsdfdsfdsfsdfsd<br />
    sadadsadsad<br />asdsadsadsadsadsadsad<br />
    asdsadsadsadsadsad
    </p>
   <script type="text/javascript">
    alert(document.getElementById('paragraph').offsetHeight);</script>
    </body></html>

如果在p标签中存在：

<h1></h1> or <h2></h2>...

它不返回p标签的实际高度

jquery ($("#paragraph").height()) 返回0，也是如此

document.getElementById('paragraph').offsetHeight
document.getElementById('paragraph').style.height

如何解决这个问题？这是不是一个错误？

我已经在 ubuntu 上用 firefox、chrome、opera（最新版本）对其进行了测试，但无法正常工作。

【问题讨论】：

标签： javascript html dom tags

【解决方案1】：

<h1> 元素作为<p> 的后代是无效的，因此浏览器将其移出，将<p> 留空，为您提供 0 高度。

在 Safari 中生成的标记如下所示：

<p id="paragraph"></p>
<h1>HELLO</h1>
dfsdfdsfdsfsdfsd<br>
sadadsadsad<br>asdsadsadsadsadsadsad<br>
asdsadsadsadsadsad
<p></p>

【讨论】：

@loannis - 浏览器尝试更正无效标记。未闭合的标签、放置不当的标签等。他们尽最大努力猜测最佳修正，但结果并不总是如你所愿。最终，您只需从<p> 中删除<h1>，或将其更改为<div>。
我认为那很愚蠢。为什么我不能在
中插入

而我可以在
???
这是 DOM 结构的基础 - 更多信息请参阅 W3C 标准 - w3.org/TR/html4/struct/global.html
从概念上讲：因为<p> 是一个段落。如何在段落中放置标题？从技术上讲：因为<p> 是一个带有可选结束标记的元素，所以如果解析器看到一个新的块级元素，它会猜测您只是省略了</p>，这是HTML 2.0 时代最常见的做法并且仍然很普遍。否则这些块会堆积起来，页面末尾会留下一百个嵌套的<p> 标签。 HTML解析充满了这样的“方便”怪癖；如果您需要它更可预测，则必须使用 XHTML。
xm，看来我也不能在
中插入

。是否有关于
??? 中允许哪些元素的参考

而我可以在 ???

而我可以在
???