JavaScript获取元素在浏览器画布中的绝对位置【转】

avaScript中提供获取HTML元素位置的属性: 

HTMLElement.offsetLeft 
HTMLElement.offsetHeight 
但 是须要注意的是,这两个属性所储存的数值并非该元素相对整个浏览器画布的绝对位置,而是相对于其父元素位置的相对位置,也就是说这两个数值获得的是以其 父元素左上角为(0,0)点从而计算出的数值。那么如何获得一个HTML元素的绝对位置呢,前一阵找到的一个比较好的函数,分享一下: 

//获取元素的纵坐标 
浏览器

 

function getTop(e){  
var offset=e.offsetTop;  
if(e.offsetParent!=null) offset+=getTop(e.offsetParent);  
return offset;  
}
 

//获取元素的横坐标  函数

function getLeft(e){  
var offset=e.offsetLeft;  
if(e.offsetParent!=null) offset+=getLeft(e.offsetParent);  
return offset;  
}

 

其原理就是利用HTMLElement.offsetParent属性,若是当前元素的父元素不是空(null),则在本来的offsetTop基础上加上当前的offsetTop,而后继续获取父元素的父元素的offsetTop,再将其加之,最终递归出该元素相对于整个浏览器画布的纵坐标。横坐标亦然。 spa

相关文章
相关标签/搜索