炫意html5
最早CSS3和HTML5移动技术网站之一

js获取某dom到根元素的offsetLeft/offsetTop

前言

大家知道,offsetLeft和offsetTop都是获取当前元素到其定位父级(offsetParent)的距离,我前面也有很多文章介绍宽高和offset,例如:https://www.xyhtml5.com/post/js_jquery_height 等
在实际的开发过程中,我们通常要获取dom到根元素的距离。这个如何做呢?

思路

其实很简单,父元素是offsetParent,我们循环查找offsetParent,直到根节点为止。

获取距离顶部距离

 getElementTop(element) {
var actualTop = element.offsetTop
var current = element.offsetParent
while (current !== null) {
actualTop += current.offsetTop
current = current.offsetParent
}
return actualTop
},

获取距离左侧的距离

  getElementLeft(element) {
var actualLeft = element.offsetLeft
var current = element.offsetParent
while (current !== null) {
actualLeft += current.offsetLeft
current = current.offsetParent
}
return actualLeft
},

小结

今天文章比较简单,主要是工作中用到的总结一下~

炫意HTML5 » js获取某dom到根元素的offsetLeft/offsetTop

Java基础教程Android基础教程