jQuery .height（）在div上输出与.scrollHeight相同的值：overflow（auto）（IE8）
在绕过许多其他问题后，我找不到解决问题的答案。
我正在编写一个脚本来查明div是否溢出。 但是在尝试使用jQuery.height() ， jQuery.innerHeight()或JavaScripts offsetHeight检索可见高度时。 我得到整个div的值（包括溢出的部分），即：与scrollHeight相同的值。
包含DIV的风格：
{ overflow-x: hidden; overflow-y: auto; width: 73%; bottom: 0px; float: left; height: 100%; top: 0px; }
我已经在jsFiddle上创建了一个模拟场景： http ： //jsfiddle.net/Lukedturnbull/L2bxmszv/3/ （确保将预览屏幕缩小以创建滚动条）
一切似乎都很好， jQuery.height()和jQuery.innerHeight()与overflow属性无关。 它们将返回高度，而不仅仅是可见部分。
如果您想知道内容高度，则必须使用scrollHeight 。 这个scrollHeight是一个常规的javascript属性，你不必使用jQuery
document.getElementById("wrapper").scrollHeight;
或者你可以使用jQuery选择器
$('#wrapper')[0].scrollHeight;
看到工作jsfiddle： http ： //jsfiddle.net/scgz7an5/1/
请注意
$('#wrapper').scrollHeight;
返回undefined。
UPDATE
你忘记了浮动元素中最重要的部分。 你忘了清除它们。
看看这个jsfiddle，是你的编辑，但浮动元素被清除。 在那里你看到scrollHeight和jQuery.height()不同值。 看到.structureContent是滚动条，而不是.content .width100 。
.structureContent有overflow:auto和你看到的滚动条来自它。
http://jsfiddle.net/L2bxmszv/5/
我添加了这个类来清除你的浮动元素。
.clearfix:before, .clearfix:after, { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } .clearfix:after { clear: both; } .clearfix { zoom: 1; }
输出是这样的：
.content 324 for scrollHeight 324 for clientHeight 324 for jQuery.height() .structureContent 324 for scrollHeight 276 for clientHeight 276 for jQuery.height()
查看有关浮动元素的精彩文章并在此处清除它们： http ： //css-tricks.com/all-about-floats/
您看到的滚动条实际上位于.structureContent元素上，而不是.content 。 这就是.content返回所有相同值的原因。 .content没有被截断。
我现在已经为我的问题找到了解决方案，虽然我不完全理解为什么这样做。
这不是我编写的HTML和代码，我只是编写一个修复程序来查看滚动条是否出现。 但我发现获取容器父级的ScrollHeight和Height解决了我的问题。 比较看看scrollHeight是否大于允许我解决问题的高度。