Question

JS如何判断元素相对于父窗口的绝对位置？

A.htm页面：

<script>
function tt(obj){
//该如何写这里，才能得到该元素相对于父窗口的位置？
}
</script>

<iframe src="B.htm"></iframe>
<div onclick="top.tt(this)">得到相对父窗口的位置</div>

B.htm内容：

<div onclick="top.tt(this)">得到相对父窗口的位置</div>
<iframe src="C.htm"></iframe>

C.HTM内容：

<div onclick="top.tt(this)">得到相对父窗口的位置</div>

原理：大体的原理我知道，就是框架的位置+元素位置,可是我不知道这个元素是在多少个iframe内，也不知道这些iframe的名称？
问题：如何在父窗口取得该元素相对于父窗口的绝对位置？

Answer 1

obj.clientWidth //获取元素的宽度

obj.clientHeight //元素的高度
obj.offsetLeft //元素相对于父元素的left
obj.offsetTop //元素相对于父元素的top
obj.offsetWidth //元素的宽度
obj.offsetHeight //元素的高度

区别：

clientWidth = width + padding
clientHeight = height + padding
offsetWidth = width + padding + border
offsetHeight = width + padding + border
offset比client多了border的宽度

//获取元素的纵坐标（相对于窗口）
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;
}

//获取元素的纵坐标（相对于窗口）
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;
}

Answer 2

<div id="div_status" style="width:101px; height:102px; border:1px solid #ffff00; position:fixed; top:103px; left:104px;">xianshineirong</div>
<script type="text/javascript">
window.onload=function(){
window.alert(document.getElementById('div_status').style.left);
}
</script>