javascript - 计算动态加载的 div 的高度

Question

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

示例代码如下:

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

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

JS代码:

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

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

非常感谢任何帮助。

提前致谢。

Answer 1

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

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

注意，不需要header和header.row；您应该只使用 header row 为 div 提供两个类。