Javascript document.body.scrollTop Firefox 返回 0 ：只有 JS
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28633221/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
document.body.scrollTop Firefox returns 0 : ONLY JS
提问by Al Ex Tsm
Any alternatives in pure javascript?
纯javascript中的任何替代方案？
The following works in opera, chrome and safari. Have not tested yet on explorer:
以下作品适用于歌剧、铬和野生动物园。尚未在资源管理器上测试：
http://monkey-me.herokuapp.com
http://monkey-me.herokuapp.com
https://github.com/coolcatDev/monkey-me-heroku/blob/master/static/js/myscripts.js
https://github.com/coolcatDev/monkey-me-heroku/blob/master/static/js/myscripts.js
At page load should scroll down to div '.content':
在页面加载时应向下滚动到 div '.content'：
var destiny = document.getElementsByClassName('content');
var destinyY = destiny[0].offsetTop;
scrollTo(document.body, destinyY, 200);
function scrollTo(element, to, duration) {
if (duration <= 0) return;
var difference = to - element.scrollTop;
var perTick = difference / duration * 2;
setTimeout(function() {
element.scrollTop = element.scrollTop + perTick;
scrollTo(element, to, duration - 2);
}, 10);
};
回答by Michelangelo
Try using this: document.documentElement.scrollTop. If I am correct document.body.scrollTopis deprecated.
尝试使用这个：document.documentElement.scrollTop。如果我是正确的document.body.scrollTop，则不推荐使用。
Update
更新
Seems like Chrome does not play along with the answer, to be safe use as suggested by @Nikolai Mavrenkov in the comments:
似乎 Chrome 不与答案一起玩，按照@Nikolai Mavrenkov 在评论中的建议安全使用：
window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0
window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0
Now all browsers should be covered.
现在应该涵盖所有浏览器。
回答by Wh1T3h4Ck5
Instead of using IFconditions, there's easier way to get proper result by using something like this logical expression.
除了使用IF条件之外，还有一种更简单的方法可以通过使用类似这个逻辑表达式的内容来获得正确的结果。
var bodyScrollTop = document.documentElement.scrollTop || document.body.scrollTop;
Both parts return zero by default so when your scroll is at zero position this will return zero as expected.
默认情况下，这两个部分都返回零，因此当您的滚动位于零位置时，这将按预期返回零。
bodyScrollTop = 0 || 0 = 0
On page-scroll one of those parts will return zero and another will return some number greater than zero. Zeroed value evaluates to false and then logical OR||will take another value as result (ex. your expected scrollTopis 300).
在页面滚动时，这些部分之一将返回零，另一个将返回一些大于零的数字。归零值计算为 false，然后逻辑OR||将采用另一个值作为结果（例如，您预期的scrollTop为300）。
Firefox-like browsers will see this expression as
类似 Firefox 的浏览器会将此表达式视为
bodyScrollTop = 300 || 0 = 300
and rest of browsers see
和其他浏览器看到
bodyScrollTop = 0 || 300 = 300
which again gives same and correct result.
这再次给出了相同且正确的结果。
In fact, it's all about something || nothing = something:)
事实上，这都是关于something || nothing = something:)
回答by Anthony Johnston
The standard is document.documentElementand this is used by FF and IE.
标准是document.documentElement，这被 FF 和 IE 使用。
WebKit uses document.bodyand couldn't use the standard because of complaints about backward compatibility if they changed to the standard, this post explains it nicely
WebKit 使用document.body并且无法使用标准，因为如果他们更改为标准，就会抱怨向后兼容性，这篇文章很好地解释了它
https://miketaylr.com/posts/2014/11/document-body-scrolltop.html
https://miketaylr.com/posts/2014/11/document-body-scrolltop.html
There is a new property on document which WebKit now supports
WebKit 现在支持文档上的一个新属性
https://developer.mozilla.org/en/docs/Web/API/document/scrollingElement
https://developer.mozilla.org/en/docs/Web/API/document/scrollingElement
so this will get you to the right element
所以这会让你找到正确的元素
var scrollingElement = document.scrollingElement || document.documentElement;
scrollingElement.scrollTop = 100;
and there is a polyfill too
还有一个 polyfill
