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的名称?
问题:如何在父窗口取得该元素相对于父窗口的绝对位置?

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;
}
温馨提示:内容为网友见解,仅供参考
第1个回答  2010-12-01
<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>本回答被网友采纳

JS如何判断元素相对于父窗口的绝对位置?
obj.offsetTop \/\/元素相对于父元素的top obj.offsetWidth \/\/元素的宽度 obj.offsetHeight \/\/元素的高度 区别:clientWidth = width + padding clientHeight = height + padding offsetWidth = width + padding + border offsetHeight = width + padding + border offset比client多了border的宽度 \/\/获取...

JS中怎么获取input所在页面的绝对坐标
\/\/ 元素相对于页面的绝对位置 = 窗口滚动偏移 + 元素相对于窗口的绝对位置var inputOffsetTop = sizeObj.top + bodyOffset.top; \/\/ 距顶部var inputOffsetLeft = sizeObj.left + bodyOffset.left; \/\/ 距左侧希望能解决你的问题,有疑问可追问,望采纳~...

原生JS获取页面中DIV绝对位置的方法
样式 getBoundingClientRect用于获取某个元素 相对于视窗 的位置集合。集合中有top, right, bottom, left等属性。offsetLeft指的是元素相对于 版面或 由 offsetParent 属性指定的 父坐标 的计算上侧位置,整型,单位像素。 借用这个思路,当我们想获取元素的绝对位置时,可以递归遍历,直到元素的父元素为...

在js里什么是窗口的绝对位置 如果没有它会怎样
窗口的绝对定位说的是css里的position:absolute属性。如果非要用JS写的话,就 style="position:absolute;"如果没有了,那个拥有这个属性的面板的位置可能发生移位

JS中的offsetLeft属性具体有什么用?
如果元素本身设置了定位,那么它的offsetLeft值就是从它的最近的定位祖先元素(即offsetParent)开始计算的。这个属性非常有用,特别是在进行页面布局和元素定位时。例如,如果你想要让一个元素相对于页面上的另一个元素进行定位,你可以使用offsetLeft属性来获取元素的位置信息,然后根据这个位置信息来调整元素...

js中position用法
是相对于元素本应放在那里的一个偏移量,left,right,top,bottom属性可以使用,值默认为0,没有设置这些属性的话,和使用static放的位置是一样的,可以最为absolute的子元素的参考坐标。3、fixed也是绝对定位,但是这个绝对定位是相对于窗口的,并且始终相对于窗口的,不管父元素的position是什么值。

如何取一iframe中对象的绝对坐标
var h = window.framename.document.getElementById("input1").offsetTop;h += document.getElementById("iframe1").offsetTop;document.getElementById("div1").style.top = h+20+"px";\/\/left同理

请教javascript中取得对象绝对位置的问题
首先:js代码 function NUM(b) {}function oMove(event, obj) {var left1 = document.body.clientLeft;var left2 = obj.offsetLeft;var left3 = obj.clientLeft;var sX = left1 + left2 + left3;\/\/---获得元素左端到浏览器左端的距离var top1 = document.body.clientTop;var top2 = ...

有没有直接获取页面元素绝对位置的js函数
getBoundingClientRect(),居然有这么一个函数,我从来都没看到过=.= x=oRect.left y=oRect.top 这样就得到两个坐标了,楼上的递归法

div标签里面的相对绝对position属性怎么设置?
使用绝对定位的nav层前面的或者后面的层会认为这个层并不存在,也就是在z方向上,它是相对独立出来的,丝毫不影响到其它z方向的层。所以position:absolute用于将一个元素放到固定的位置很好用,但是如果需要层相对于附近的层来确定位置就无能为力了。3)DIV布局属性之position:fixed,相对于窗口的固定定位...

相似回答