需要找到页面上隐藏div的高度（设置为display:none）

我需要测量隐藏元素内部的 div 的 offsetHeight。

<div id="parent" style="display: none;">
    <div id="child">Lorem Ipsum dolor sit amet.</div>
</div>

父级divmust设置为“display:none“。我对此无法控制。我意识到子 div 的 offsetHeight 将是 0。我需要找到一个解决方法。

我玩过的事情是，当页面加载时，我复制父节点的子节点，在页面上的 div 中注入设置为“visiblity:hidden”。然后我测量这些元素的高度，并在完成后删除节点。

还有其他想法吗？

Update:我最终要做的是：

使用 YUI 2，在页面加载时，我发现给定类名的所有元素要么设置为 display:none，要么其高度和宽度为 0（这是测量元素是否存在或父元素是否设置为显示的一种方法） ：没有任何）。然后我将该元素设置为 display:block。然后我检查它的父母是否有同样的事情并向父母展示，直到它找到可见的父母。一旦最高的显示：无祖先设置为显示：块，我就可以测量我的元素。

测量完所有元素后，我将所有元素重置回显示：无。

你需要使元素的父元素可见在您获取元素尺寸的那一刻。在通用解决方案中，通常会遍历所有祖先并使其可见。然后他们的display值被设置回原始值。

当然还有性能问题。

我们在 Prototype.js 实现中考虑了这种方法，但最终得到了getWidth and getHeight 仅使实际元素可见，无需遍历祖先。

替代解决方案（例如将元素从“隐藏”父级中取出）的问题在于，一旦元素脱离了“常规”层次结构，某些样式可能不再适用于该元素。如果你有这样的结构：

<div class="foo" style="display:none;">
  <div class="bar">...</div>
</div>

以及这些规则：

.bar { width: 10em; }
.foo .bar { width: 15em; }

那么从其父元素中取出元素实际上会导致错误的尺寸。