问题
When trying to find out how much a web page has been scrolled from the top, which of these should one use:
document.body.scrollTop
,
document.documentElement.scrollTop
,
window.pageYOffset
,
window.scrollY
Which one(s) would I choose in these 2 separate scenarios:
a) If I wanted maximum compatibility (across the main browsers used currently)?
b) If I wanted code that was most standards compliant/future-proof/strict-mode-compatible (but didn't care about supporting old/non-standard browsers)?
回答1:
I'm using three of them in the skrollr source
return window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
https://github.com/Prinzhorn/skrollr/blob/b98d40820b9864be275e81af382045d72cc5a08a/src/skrollr.js#L627
a) So far it's working across all browsers (nobody complaint in the past year).
b) Since it will use the first one that is defined, I guess it's pretty future proof and stable.
If you're fancy you could do this as well
Math.max(window.pageYOffset, document.documentElement.scrollTop, document.body.scrollTop)
回答2:
Given that skrollr does not use window.scrollY
, this may have been obvious, but as further answer to the original question: window.pageYOffset
is an alias for window.scrollY
. See Window.scrollY.
回答3:
To Prinzhorn's answear:
Since body
and documentElement
is undefined
in Chrome/Firefox, better use:
return window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
Tested myself.
回答4:
Chrome uses documentElement.scrollTop
, firefox uses body.scrollTop
来源:https://stackoverflow.com/questions/19618545/body-scrolltop-vs-documentelement-scrolltop-vs-window-pageyoffset-vs-window-scro