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，再將其加之，最終遞歸出該元素相對於整個瀏覽器畫布的縱座標。橫座標亦然。