8

使用纯 Javascript 或 jQuery，我需要获得滚动元素的完整高度。但是 DOM 属性scrollHeight 显然不是 100% 可靠的。

我设想暂时给项目一个css高度auto，检查它的大小，然后将css返回到它的先前值（这本身就有问题——我如何获得cssheight:100%而不是height:1012px像jQuery那样.css('height')返回）。但后来我发现，由于 jQuery 将 css 样式直接应用于元素的方式，只需应用样式即可将其''返回到其正常的样式表声明值，所以理论上我可以这样做：

$el.css('height', 'auto');
scrollHeight = $el.height();
$el.css('height', '');

但这行不通。height:auto不会覆盖我元素的原始样式100%并使元素占据其所需的全部高度。

所以现在我在考虑更多的事情：使用第一个子元素顶部的位置和最后一个子元素底部的位置来获取高度。（如有必要，我可以调整填充和边距，这只是一个概念证明。）

function scrollHeight($el) {
   var lastEl = $el.children(':last');
   return (
      lastEl.position().top
         + lastEl.height()
         - $el.children(':first').position().top;
   );
}

一些工作Math.max($el[0].scrollHeight, $el.height())也可能有用......

这是一个可怕的想法吗？我不可能是唯一一个需要了解scrollHeightDOM 元素并使其可靠、不会随着项目滚动而改变、在所有主要浏览器以及 IE 8 中工作的人（尽管这会很有趣了解 IE 6 和 7 的解决方案）。

4

1 回答 1

7

代替

$el.css('height', 'auto');

尝试 -

$el.attr('style', 'height: auto !important');

我提到尝试这个是因为你说 -

height:auto 不会覆盖我元素的 100% 原始样式并使元素占据其所需的全部高度。

于 2013-07-17T18:23:52.423 回答