Javascript 从页面顶部获取项目偏移量

我正在尝试获取div的顶部偏移量，当页面滚动时，我会运行以下代码：

var $elem = document.querySelector(selector);
var elemTop = $elem.offsetTop;
console.log(elemTop);

但是当我滚动时，它总是将

0

打印到控制台，即使元素在折叠下面

var elmTop = $elem.getBoundingClientRect().top + window.scrollY;

---

给出视口内的位置，window.scrollY给出从视口顶部到文档顶部的距离。

解决方案如何检查滚动是否已到达某个元素：

    const getOffsetTop = function(element) {
        if (!element) return 0;
        return getOffsetTop(element.offsetParent) + element.offsetTop;
    };

    const $el = document.querySelector(".button");

    window.addEventListener("scroll", function() {
        console.log(window.scrollY + window.innerHeight > getOffsetTop($el));
    });

---

元素是否有offsetParent？文档说：

HTMLElement.offsetTop只读属性返回当前元素相对于offsetParent节点顶部的距离。

看起来是这样的，

$elem.offsetParent

，当我在控制台中滚动时，我会得到一个html元素。好的，那么如何获得到文档根的偏移量呢？你是说是的，但是如果没有jQueryAn，另一种选择是使用element.offsetParent遍历DOM，将每个节点的offsetTop添加到一起以获得度量。这更复杂，但可能比计算getBoundingClientRect的值更有效，在Croll上执行任何操作时都要注意getBoundingClientRect的值。