Firefox scrollHeight vs溢出

Question

demo

HTML：

<div id="relative">
  <div id="absolute"></div>
</div>

CSS：

#relative {
  position : relative;
  width    : 200px;
  height   : 200px;
  overflow : visible;
}
#absolute {
  position   : absolute;
  width      : 200px;
  height     : 300px;
  background : #eee;
}

JavaScript：

console.log($("#relative").get(0).scrollHeight);
$("#relative").css({
  "overflow-x" : "hidden",
  "overflow-y" : "scroll"
});
console.log($("#relative").get(0).scrollHeight);

它在 chrome 中返回“300, 300”，在 Firefox 中返回 9, “200, 300”。

有没有办法在不改变溢出的情况下检测“300”？

Answer 1

没有滚动条 = 没有 scrollHeight。

当一个元素的内容不产生垂直滚动条时，它的 scrollHeight 属性等于它的 clientHeight 属性。

https://developer.mozilla.org/en-US/docs/DOM/element.scrollHeight