解决scrollTop值总为0

scrollTop值为 0

近期作者在项目中遇到了一个问题。 项目内容大致是点击某些元素，进入到另外的页面。这里因为是h5页面，直接用的显示与隐藏的关系来进入其他页面。但是每次设置完display为none后，关闭进入的页面，回到首页后发现首页自动置顶了。于是参考其他博客说可以使用scrollTop设置

var windowsTop = document.body.scrollTop
// 这里采用的是localstorage缓存，点击元素时储存这个windowsTop，然后在关闭页面时，将这个值赋给body，获取localstorage的值这里省略了
document.body.scrollTop = windowsTop

这样操作下来，pc端显示正常，点击关闭后，首页保持在点击进入的位置。然而安卓端依旧置顶了。。。
继续参考博客
说可以这样操作

var windowsTop = document.body.scrollTop || document.documentElement.scrollTop

我原本以为是兼容的问题，然而，too young too naive。
根本不是！！
手机上打印这个windowsTop的值始终是0.
然后作者就找同事帮忙，发现，原来首页设置滚动条的并不是body。。。
而是一个class叫threeCard的div。。。
那么好吧，在继续操作一下。。

var windowsTop = $('.threeCard').scrollTop()

这样看看手机打印的结果---- 0 ，emmm
继续找问题，原来是这个threeCard并没有设置overflow：auto，那么加上之后打印结果是什么呢？
这下终于有值了，不是0！！！

$('.threeCard').scrollTop(windowsTop)

这样就正确了，pc端和移动端显示正常。

下面补充一下知识点：

• 当一个元素的display属性为’none’时，对该元素设置scrollTop属性是无效的，所以，即使是jQuery的scrollTop方法也会无效
  参考自 博文
• 当scrollTop的值始终为0的时候，别着急看是不是兼容问题，先看看设置滑动的是是body，还是其他元素。
• jquery的scrollTop是个方法，并不能直接(’.propertyName’).scrollTop, 同样，在赋值时也不能直接(’.propertyName’).scrollTop = 某值，而是(’.propertyName’).scrollTop(某值)。