获取任意DOM元素距离页面顶部HTML的距离:自己写的迭代方法,一看就懂,百度搜的答案个人感觉全是是错的,测试下来根本不符合

function toTopHeight(el) {
    var top_height = el.offsetTop;      //先保存当前元素的offsetTop值
      if(el&&el.nodeName!='HTML') {
          el = el.parentElement;
        while(el&&el.nodeName!="HTML"){//当当前元素不是顶部html标签时,继续迭代
            if(getComputedStyle(el).position!=='static'){
            //只有当元素有定位时,才将此元素的offsetTop值加入到结果中,因为offsetTop的值是距离自身到离自身最近的有定位的父元素的内壁的距离
                top_height+=el.offsetTop;
            }
            el = el.parentElement;
          }
      }
      return top_height;
}

有不懂或者错误的地方可以在下方评论区交流讨论

你可能感兴趣的:(前端,javascript,css,html)