和页面顶部的绝对间距

日常开发中,我们经常需要获取页面元素上的各种相对距离、绝对距离,其中获取一个div距离页面(body)顶部的绝对距离比较复杂,这里记录一下。

function absoluteOffsetTop (el) {
    var result = 0;
    while (el && el.tagName.toLowerCase() !== 'body') {
        result += el.offsetTop;
        el = el.offsetParent;
    }
    return result;
}

上面代码中的函数,能够实现上述功能。我们直到DOM中offsetTop这个属性能够获取元素相对父元素的顶部偏移,上面代码能一层层迭代计算所有的父子元素,加到一起就是相对整个页面的顶部偏移了。

作者:Gacfox
版权声明:本网站为非盈利性质,文章如非特殊说明均为原创,版权遵循知识共享协议CC BY-NC-ND 4.0进行授权,转载必须署名,禁止用于商业目的或演绎修改后转载。
Copyright © 2017-2024 Gacfox All Rights Reserved.
Build with NextJS | Sitemap