在前端开发中，我们经常需要获取页面滚动条的位置。通常情况下，我们会使用 jQuery 的 $(document).scrollTop() 方法来获取滚动条距离顶部的距离。但是，有时候会遇到这样一个问题：该方法总是返回 0，即使页面已经滚动了。
原因分析
该问题的原因是因为在一些浏览器中（比如 Chrome），$(document).scrollTop() 已经不再起作用，而应该使用 $(window).scrollTop()。
解决方案
为了解决该问题，我们可以根据不同的情况来采取不同的措施。
方案一：使用 $(window).scrollTop()
如上所述，在一些浏览器中，使用 $(window).scrollTop() 方法可以正确地获取滚动条的位置。
--- --------- - ----------------------
方案二：检查 HTML 和 Body 元素的高度
如果使用 $(window).scrollTop() 方法仍然无法获取到正确的值，那么我们需要检查一下 HTML 和 Body 元素的高度是否被正确设置了。一些浏览器会出现这个问题，特别是在使用一些 CSS 样式库时。
----- ---- - ------- ----- -
方案三：使用原生 JavaScript 获取滚动条位置
如果以上两种方法都不能解决问题，我们可以使用原生 JavaScript 来获取滚动条的位置。通过 document.documentElement.scrollTop 和 document.body.scrollTop 可以获取到当前文档顶部到视口顶部的距离，然后取其中非零的那一个即可。
--- --------- - ---------------------------------- -- ------------------------
总结
在前端开发中，获取页面滚动条的位置是一个常见需求。如果遇到 $(document).scrollTop() 方法总是返回 0 的问题，我们可以根据不同的情况采取不同的措施来解决。无论选择哪种方案，都需要注意浏览器兼容性和代码的可维护性。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/14582