在没有滚动条的情况下获取 div 高度答案

【问题标题】：Get div height without the scrollbar在没有滚动条的情况下获取 div 高度
【发布时间】：2014-12-22 10:09:09
【问题描述】：

是否可以在不考虑水平滚动条的情况下获得水平和垂直可滚动 div 的高度？我正在尝试获取 div 可见部分的高度。

【问题讨论】：

它并不完全相同，但这涉及从带有垂直条的宽度获取宽度，您可能会实施类似的解决方案。 stackoverflow.com/questions/10692598/… 基本上，它建议将一个 div 放在另一个里面，使宽度（或在你的情况下为高度）100%，你可以给它零宽度，然后得到里面的高度。

标签： html css

【解决方案1】：

试试这个

html

<div class="div1">
    <div class="div2"></div>
</div>

使用 jQuery

var width = $('.div1')[0]['clientWidth'];
var height = $('.div1')[0]['clientHeight'];

工作演示 http://jsfiddle.net/7xmun47a/

【讨论】：

非常有趣的解决方案

【解决方案2】：

我想你可能正在寻找window.getComputedStyle(element, null)。该文档可以在mdn documentation's site 上找到。

示例如下：

var container = document.getElementById("whatever");
var computed = window.getComputedStyle(container, null).getPropertyValue("height");
// or pass width to getPropertyValue

这应该给你减去滚动条的宽度。

jsbin example

【讨论】：

不适用于 mozilla 它还包括滚动条的高度和宽度

【解决方案3】：

实际上有两种方法可以获取元素的可见宽度或高度。

第一种方式是使用offsetHeight或offsetWidth：这些家伙返回您元素的可见高度或宽度，包括：边框、填充、滚动条和边距。

你像这样使用它们yourDiv.offsetHeight

第二种方法是使用clientHeight 或clientWidth：除了它们只返回可见高度`或可见宽度和填充但没有边框、滚动条和边距之外，它们与上面的相同。李>

参考：

希望对你有帮助

【讨论】：

【解决方案4】：

你可以使用overflow-y 表示垂直或overflow-x 表示水平

overflow-y:scroll;

【讨论】：

你的回答与问题无关