有没有直接获取页面元素绝对位置的js函数

Question

比如<table align=center><tr><td id=t1>abc</td></tr></table>
如果我要获取t1在页面中的绝对x,y坐标,我不得不先计算table的坐标再叠加(特别是left)
想问一下有没有直接获取t1绝对坐标的js函数

Answer 1

offsetHeight 
offsetLeft
这两个东西 ？

Answer 2

Jquery的$("table").offset()，你试试呢。

Answer 3

//获取元素的纵坐标
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，再将其加之，最终递归出该元素相对于整个浏览器画布的纵坐标。横坐标亦然。

Answer 4

我好像找到了一个直接的方法
getBoundingClientRect(),
居然有这么一个函数,我从来都没看到过=.=
x=oRect.left   
y=oRect.top  
这样就得到两个坐标了,楼上的递归法就是我目前用的

Answer 5

但是仍然有些问题,我试图把新建的一个ul元素定位到上述得到的结果中,发现位置总是偏右一些,不知道是什么原因,两种方法都存在这个问题
比如我在js中对新元素定位
newul.style.left=x;
newul.style.top=y;//x,y为上面得到的原元素的位置
按预期这个ul应该覆盖在原元素之上,但是实际的结果是在原元素的右侧,求教原因

Answer 6

getBoundingClientRect
这个以前是IE ONLY 
 后来FF也支持了    不知道其他浏览器怎么样