$（document）.height（）随机刷新值（Safari 5.1.10）

Question

我使用$(document).height()在块上设置height CSS属性。这是Safari 5.1.10（OSX 10.6.8）的解决方法，因为vh单元（视口高度）在此版本上不起作用。

(function() {
    if(!Modernizr.cssvhunit) $("#sidebar").css("height", $(document).height()+"px");
})();

问题是每次刷新页面时，$(document).height()返回的值都不一样。有时它是视口高度，有时是文档高度，有时是两者之间的值......

我使用： Modernizr 2.8.3 来检测vh单元支持， jQuery 1.11.0 ， Lightbox 2.7.1 （没有它的问题仍然存在）和 Skeleton 2.0.4 。

我也试过这种解决方法，但它不起作用：

function getDocHeight() {
    var D = document;
    return Math.max(
        D.body.scrollHeight, D.documentElement.scrollHeight,
        D.body.offsetHeight, D.documentElement.offsetHeight,
        D.body.clientHeight, D.documentElement.clientHeight
    );
}

我不知道是什么会导致这个假设的常数值变化......

Answer 1

听起来您可能正在获得高度，而页面中的图像仍在加载，因此页面仍在扩展。

在这种情况下，请尝试在$(window).load(fn)事件下获取高度，因为此时应加载所有图像。

Answer 2

有时在一段时间后测量高度和宽度会有所帮助。

setTimeout(function() {
  // get w, h
},1);

说明：JS-in-the-browser是一个基于evend的前端系统。重复以下步骤：

1. 接收用户/超时/ AJAX事件
2. 运行JavaScript侦听器（如果有）
3. 重新呈现DOM更改

页面渲染发生在＃3，但是您的JS代码在＃2，之前运行最终/适当大小确定显示元素。当＃3已经完成时，重新运行3步循环将在＃2中设置非常短的超时。

这就是为什么没有效果，当你隐藏一个元素，然后显示它，然后重复它甚至100次：在＃2期间没有渲染，如果你让它显示，＃3将发现没有变化，没有任何反应。

嗯，它不是太优雅，需要额外的努力来编写一个UI程序，它无法在需要时获得尺寸。