藤三七果实有什么用处:offsetParent - 【Bollton】的日志 - 网易博客
来源:百度文库 编辑:九乡新闻网 时间:2024/07/14 03:26:12
offsetParent
Javascript2010-09-14 16:46:56阅读118评论1 字号:大中小 订阅
offsetParent属性返回一个对象的引用,这个对象是距离调用offsetParent的元素最近的(在包含层次中最靠近的),并且是已进行过CSS定位的容器元素。如果这个容器元素未进行CSS定位,则offsetParent属性的取值为根元素(在标准兼容模式下为html元素;在怪异呈现模式下为body元素)的引用。当容器元素的style.display 被设置为 "none"时(译注:IE和Opera除外),offsetParent属性 返回 null。句法:
parentObj = element.offsetParent
变量:
· parentObj 是一个元素的引用,当前元素的偏移量在其中计算。
function offset_init(){
var pElement = document.getElementById("sonObj");
parentObj = pElement.offsetParent;
alert(parentObj.tagName);
}
load="offset_init()">
测试OffsetParent属性
测试结果:
Firefox3:"BODY"
Internet Explorer 7:"BODY"
Opera 9.51:"BODY"
Chrome 0.2:"BODY"
Safari 3:"BODY
结论:
当某个元素及其DOM结构层次中元素都未进行CSS定位时(absolute或者relative)[或者某个元素进行CSS定位时而DOM结构层次中元素都未进行CSS定位时],则这个元素的offsetParent属性的取值为根元素。更确切地说,这个元素的各种偏移量计算(offsetTop、offsetLeft等)的参照物为Body元素。(其实无论时标准兼容模式还是怪异模式,根元素都为Body元素)
测试代码2
测试OffsetParent属性
#parent{
position:absolute;
left:25px;
top:188px;
border:1px solid black;
}
function offset_init(){
var pElement = document.getElementById("sonObj");
parentObj = pElement.offsetParent;
alert(parentObj.tagName);
}
load="offset_init()">div测试代码
测试结果:
Firefox3:"DIV"
Internet Explorer 7:"DIV"
Opera 9.51:"DIV"
Chrome 0.2:"DIV"
Safari 3:"DIV"
结论:
当某个元素的父元素进行了CSS定位时(absolute或者relative),则这个元素的offsetParent属性的取值为其父元素。更确切地说,这个元素的各种偏移量计算(offsetTop、offsetLeft等)的参照物为其父元素。
测试代码3
测试OffsetParent属性
#Grandfather{
position:relative;
left:25px;
top:188px;
border:1px solid black;
}
function offset_init(){
var pElement = document.getElementById("sonObj");
parentObj = pElement.offsetParent;
alert(parentObj.tagName);
}
load="offset_init()">
Untitled Document
测试结果:
Firefox3:"H1"
Internet Explorer 7:"H1"
Opera 9.51:"H1"
Chrome 0.2:"H1"
Safari 3:"H1"
结论:
当某个元素及其父元素都未进行CSS定位时(absolute或者relative),则这个元素的offsetParent属性的取值为在DOM结构层次中距离其最近,并且已进行了CSS定位的元素。
在td中的元素会把第一个绝对/相对定位的hierarchy parent当作offsetParent,如果没有找到需要分三种情况讨论
一,如果该元素没有绝对/相对定位,则会把td当作offsetParent
二,如果该元素绝对/相对定位并且table没有绝对/相对定位,则会把body当作offsetParent
三,如果该元素绝对/相对定位并且table绝对/相对定位,则会把table当作offsetParent
offsetParent - 【Bollton】的日志 - 网易博客
人生如梦的日志 - 网易博客
无所谓的日志 - 网易博客
独钓寒江的日志 - 网易博客
wzx的日志 - 网易博客
蜜蜂的日志 - 网易博客
baqq的日志 - 网易博客
老鹰的日志 - 网易博客
- zhangliyin0128的日志 - 网易博客
小莉的日志 - 网易博客
天堂鸟的日志 - 网易博客
柳上惠的日志 - 网易博客
飘扬的日志 - 网易博客
牧笛的日志 - 网易博客
檀香的日志 - 网易博客
雁飞墨行的日志 - 网易博客
西的日志 - 网易博客
ldq51232008的日志 - 网易博客
医圣的日志 - 网易博客
nanfengjiancai的日志 - 网易博客
dbzxg142的日志 - 网易博客
杏的日志 - 网易博客
- 沾衣欲湿的日志 - 网易博客
小和尚的日志 - 网易博客