包装文档或窗口对象以检查滚动值？

Question

为了检查页面的滚动值，我用jQuery包装了window对象，但是在滚动时，滚动事件的目标元素结果是document对象：

$(window).scroll(function(e) {
    alert('Scrolling ' + e.target);
});

包裹以检查滚动值的正确对象是什么？
我知道它们之间的区别（一个窗口可以包含多个框架，因此可以包含许多文档），但是对于单个文档上下文，我看到滚动值是一致的：

alert($(window).scrollTop() === $(document).scrollTop());

编辑：

原生 JavaScript 也会发生这种情况：

window.onscroll = function(e) { alert('scrolled ' + e.target); };

元素绑定为window，但事件目标为document。

关于上面写的表达式，比较window对象的scrollTop值与document对象之一：jQuery文档解释$(window).width()返回视口的宽度，而$(document).width()返回视口的宽度HTML DOM 元素的宽度；由于视口可能小于整个 HTML 元素的宽度，因此这两个值可能不同。

Answer 1

暂时不考虑 jQuery，使用纯 JavaScript 可以检查 window 的以下属性以了解当前垂直滚动位置：

window.pageYOffset;
window.scrollY; 

第二个不是跨浏览器according to MDN。尽管如此，在 IEdocument.body.scrollTop，因为 window 的任何属性都不会为您提供当前滚动位置。实际上，document.body.scrollTop 是我最常使用的，因为根据我的经验，它只适用于跨浏览器（此处需要引用和检查）。

jQuery 考虑了浏览器的差异，并从正确的对象中获取正确的属性，而不管您为.scrollTop() 使用哪个选择器（看看source code）。简而言之，在询问.scrollTop() 时，使用jQuery 选择window 或document 都没有关系。它将寻找window.pageYOffset，如果找不到，它会返回document.body.scrollTop。

---

关于您对每个窗口的多个文档的评论的注释：从技术上讲，每个 window 对象仅指向一个 document，反之亦然。当您有多个框架时，每个框架都有单独的 window 和 document 元素。例如，如果您获得对单个 iframe 的引用，则可以从中获得自己的 window 和 document：

// first iframe in main document
var ifr = document.getElementsByTagName('iframe')[0];
var ifrWindow = ifr.contentWindow;
var ifrDocument = ifrWindow.document; 
// The above is good for new and old browsers; 
// ifr.contentDocument is also available on modern browsers