首先是 parentNode 属性，这个属性好理解，就是在 DOM 层次结构定义的上下级关系，如果元素A包含元素B，那么元素B就可以通过 parentElement 属性来获取元素A。
要明白 offsetParent 属性，要先明白“已定位元素” 这个名字，所谓“已定位元素”就是指给元素设置了 position 属性的样式，并且 position 样式属性的值等于 absolute、relative、fixed 之一的元素。
在使用 offsetParent 属性获取父级对象时有以下两种情况：
1、元素本身已经定位
如果元素本身已经定位，那么 offsetParent 属性返回此元素已定位父级元素，如没有已定位的父级元素，则返回 BODY 对象，例如：
<body>
<div>
<span id="obj1" style="position:absolute"></span>
</div>
<div id="pObj1" style="position:absolute">
<span id="obj2" style="position:absolute"></span>
</div>
</body>
obj1.offsetParent 返回 BODY 对象
obj2.offsetParent 返回 pObj1 对象
2、元素没有定位
如果元素没有定位， offsetParent 不但会找已经定位的父级元素而且还会查找类型为 TD 和 TABLE 的父级元素，只要找到这三种父级元素的其中任何一种元素将返回此元素，否则返回 BODY 对象，例如：
<table width="500" border="0">
<tr>
<td id="td1">
<div id="pObj1">
<span id="obj1"></span>
</div>
</td>
</tr>
<tr>
<td>
<div id="pObj2" style="position:relative">
<span id="obj2"></span>
</div>
</td>
</tr>
</table>
obj1.offsetParent 返回 td1 对象
obj2.offsetParent 返回 pObj2 对象
原文参见：js parentElement和offsetParent之间的区别
javascrip中parentNode和offsetParent之间的区别的更多相关文章
-
JavaScript中this和$(this)之间的区别以及extend的使用
jQuery中this和$(this)之间的区别: this返回的是当前对象的html对象,而$(this)返回的是当前对象的jQuery对象 举个正确的Demo实例: $("#textbo ...
-
[转] C#中out和ref之间的区别
gskcc 的原文地址 C#中out和ref之间的区别 首先:两者都是按地址传递的,使用后都将改变原来参数的数值. 其次:ref可以把参数的数值传递进函数,但是out是要把参数清空,就是说你无法把一个 ...
-
iOS 中 #import同@class之间的区别
很多刚开始学习iOS开发的同学可能在看别人的代码的时候会发现有部分#import操作写在m文件中,而h文件仅仅使用@class进行声明,不禁纳闷起来,为什么不直接把#import放到h文件中呢? 这是 ...
-
angularjs 中 Factory,Service,Provider 之间的区别
本片文章是使用了 angularjs 中使用 service 在controller 之间 share 对象和数据 的code(http://jsfiddle.net/kn46u0uj/1/) 来进行 ...
-
android中getWidth()和getMeasuredWidth()之间的区别
先给出一个结论:getMeasuredWidth()获取的是view原始的大小,也就是这个view在XML文件中配置或者是代码中设置的大小.getWidth()获取的是这个view最终显示的大小,这个 ...
-
C#中out和ref之间的区别【转】
首先:两者都是按地址传递的,使用后都将改变原来参数的数值. 其次:ref可以把参数的数值传递进函数,但是out是要把参数清空,就是说你无法把一个数值从out传递进去的,out进去后,参数的数值为空,所 ...
-
C#中out和ref之间的区别
首先:两者都是按地址传递的,使用后都将改变原来参数的数值. 其次:rel可以把参数的数值传递进函数,但是out是要把参数清空,就是说你无法把一个数值从out传递进去的,out进去后,参数的数值为空,所 ...
-
java中String,StringBuffer,StringBuilder之间的区别
文章转载自:http://www.cnblogs.com/frankliiu-java/archive/2010/07/05/1771537.html String是固定长度的字符串,如果要发生变化必 ...
-
(扫盲)C#中out和ref之间的区别
首先:两者都是按地址传递的,使用后都将改变原来参数的数值. 其次:ref可以把参数的数值传递进函数,但是out是要把参数清空,就是说你无法把一个数值从out传递进去的,out进去后,参数的数值为空,所 ...
随机推荐
-
Mybatis总结
jdbc.properties driver=com.mysql.jdbc.Driver url=jdbc:mysql://127.0.0.1:3306/testdb username=root pa ...
-
阿里云服务器Linux CentOS安装配置（三）yum安装mysql
阿里云服务器Linux CentOS安装配置(三)yum安装mysql 1.执行yum安装mysql命令:yum -y install mysql-server mysql-devel 2.启动mys ...
-
用Linux命令wget进行整站下载
wget加上参数之后,即可成为相当强大的下载工具. wget -r -p -np -k http://xxx.com/abc/-r, --recursive(递归) specify recursive ...
-
C++ Bitsets
C++ Bitsets给程序员提供一种位集合的数据结构.Bitsets使用许多二元操作符,比如逻辑和,或等. Constructors 创建新bitsets Operators 比较和赋值bitset ...
-
Raising Modulo Numbers（POJ 1995 快速幂）
Raising Modulo Numbers Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 5934 Accepted: ...
-
2015广东工业大学ACM学校巡回赛 I 游戏高手 （如压力dp）
Problem I: 游戏王 Description 小学的时候,Stubird很喜欢玩游戏王.有一天,他发现了一个绝佳的连锁组合,这个连锁组合须要6张卡. 但是他一张都没有,但是他的那些朋友们有.只 ...
-
利用Grafana展示zabbix数据
一.系统搭建(以Centos7为例)因为我们的主要目的是展示zabbix的数据,所以建议大家直接在zabbix的服务器上搭建这个系统,亲测两系统无冲突,这样部署的好处是两系统间的数据传输更快,前端展示 ...
-
sql server中replace()函数用法解析
知识点一:replace()的语法 REPLACE ( string_replace1 , string_replace2 , string_replace3 ) 参数解析: string_repla ...
-
Caffe SSD AttributeError: &#39;module&#39; object has no attribute &#39;LabelMap&#39;
caffe ssd 错误描述: AttributeError: 'module' object has no attribute 'LabelMap' SSD from caffe.proto imp ...
-
UIKeyboardTypeNumberPad 数字键盘添加完成按钮
一:添加通知 //数字键盘添加完成 [[NSNotificationCenterdefaultCenter] addObserver:selfselector:@selector(keyboardWi ...