offsetLeft

最新推荐文章于 2022-05-08 23:22:37 发布

转载最新推荐文章于 2022-05-08 23:22:37 发布 · 80 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/freakshow/archive/2010/09/28/1837596.html

文章标签：

#javascript #ViewUI

在FF中obj.offsetLeft是当前对象的position:relative的父级元素的偏移,

可是在IE中,obj.offsetLeft是相对于其父级元素的定位

<html>
<head>
<title>Dom：offsetParent使用</title>
</head>
<body>
<h2>该网页中有4个div 他们的id值分别是a,a_1,b,b_1<br/>
a包含了a_1．b包含了b_1<br/>
a和b是相互独立的．．下面我们分别对a_1和b_1两个子元素使用offsetParent方法．
你用IE浏览器测试，你会发现a1的运函数弹出body，而b1的运行函数返回了div，同样的两个子元素．同样的使用方法．为什么返回的结果不一样呢？
原因就是我为b1的父元素b,增加了一个宽度属性以后．他就把offsetParent看做是元素的父元素．如果不为b元素指定任何属性样式，他则返回body
而在火狐和谷歌浏览器中两次都会弹出body,不会受此影响．

<div id="a">
<div id="a_1"></div>
</div>

<div id="b" style="width:200px;">
<div id="b_1"></div>
</div>

<script type="text/javascript">
function a1_offsetParent(){ //测试b元素的offsetParent
var a_1 = document.getElementById("a_1");
alert(a_1.offsetParent.tagName);
}
a1_offsetParent();//运行a1测试函数

function b1_offsetParent(){
var b_1 = document.getElementById("b_1");
alert(b_1.offsetParent.tagName);
}
b1_offsetParent();//运行b1测试函数
</script>
</body>
</html>

转载于:https://www.cnblogs.com/freakshow/archive/2010/09/28/1837596.html