Javascript 计算填充浏览器高度所需的确切高度

在上，我尝试设置主内容区域的高度，使其始终填充浏览器窗口的高度。下面是我正在使用的简单代码：

$(".top-of-nav").height($(window).height() - 40);

导航顶部

是主区域（cat图像所在的位置），40px是我要减去的页面底部导航条的高度

问题是，即使减去40px以上，浏览器中也会出现垂直滚动条。

您可以使用：

document.documentElement.clientHeight

---

填充您的
身体的底部
，解决问题

body {
    padding-bottom: 0;
}

这是我在一个项目中使用的，它工作得很好：

$(window).resize(function () {
    var window_h = $(window).height();
    $('.viewport').css('height',window_h);
});

这将获取窗口高度并将任何元素设置为其高度，并在窗口调整大小时重新计算。
编辑：我误读了问题

.top-of-nav {
    top: 0;
    bottom: 40px;
    margin: 0;
    background: url(/media/1920x1080.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}

您的
有
填充底部：70px
，这导致了滚动条的观察，非常感谢。