javascript - 如何使元素的高度随着每个子元素的添加而增加

Question

我有<div>一个脚本附加了孩子。这些子元素由 PHP 脚本自动附加并使用position:absolute. 我试图为父级提供允许附加到的元素<div>的样式以增加父级的高度。唯一的问题是当我这样做时高度不会增加。有人知道我能做些什么来解决这个问题吗？min-height:400px<div>

编辑：我无法position:relative用于定位我的元素。是否有任何解决方案允许position:absolute.

Answer 1

是的，你可以使用绝对位置（yeee♥！）

LIVE DEMO TEST CASE

通过简单地做：

$(this).height( this.scrollHeight );

或者使用纯 JS：

this.style.height = this.scrollHeight ;

并将其添加到元素的 CSS 中：

overflow:hidden;
overflow-y:auto;

编辑：

该演示在 IE10、Firefox、Chrome、Safari 和 Opera 中测试良好。

这里的关键点是将 x 或 y 轴的溢出值（无论您需要大小）设置为auto，而不是默认值visible。然后可以在 HTML DOM 对象上使用scrollWidthor属性来获取元素的完整大小，包括任何绝对定位的后代。scrollHeight

overflow:hidden看起来很奇怪，这与容器的设置裁剪任何绝对定位的后代这一事实完全一致。显然，元素position:absolute并不像我们一直被告知的那样“不合时宜”:)

Answer 2

您不应该使用position: absolute它，因为以这种方式定位的东西将被拉出正常的渲染流程。这导致父母没有注意到它的内容非常高。用于position: relative子 div 的。这样父母就会自动成长。