计算动态加载div的高度

Question

我有一个要求，我的标题高度发生变化。标题需要一些时间或加载时说延迟。根据标题高度，我的身体高度必须计算，并应相应地设置。

以下是示例代码：

<div class="header header.row">
header content
</div>

<div class="main main.row">
body content
</div>

JS代码：

document.ready(function()
{
main.top=header.height;
});

我担心的是我们怎么知道标题div何时被完全加载。有没有办法找到标题最终被加载然后计算身体位置。尝试的方法是设置750ms的延迟。但是通常延迟不会在真实场景中工作，试图找到替代方案。

肯定会感谢任何帮助。

提前致谢。

Answer 1

使用 jQuery ，就像这样：

$(window).load(function() {
    $('.main').css('top', $('.header').height());
});

Answer 2

您可以收听onload事件，either on window or document，例如

document.onload = function() {
  var height = document.getElementsByClassName('header')[0].clientHeight;
}

注意，不需要header和header.row;你应该只使用header row给div这两个类。