JS-offsetParent定位父节点
offsetParent:离当前元素最激动呢一个有定位的父节点
如果没有定位父级,默认是body
IE7以下如果当前元素没有定位默认是body,如果有定位就是html
IE7以下,如果当前元素的某个父级出发了layout,(zoom: 1;)
那么offsetParent就会被指向到那个触发layout的父节点上
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style>
div {padding: 40px 50px;}
#div1 {background: red;}
#div2 {background: green; zoom: 1;}
#div3 {background: orange;}
</style>
<script>
window.onload = function() { var oDiv3 = document.getElementById('div3'); //parentNode : 父节点
//alert( oDiv3.parentNode.id ); /*alert( document.getElementById('div2').currentStyle.hasLayout );*/ alert( oDiv3.offsetParent.id ); }
</script>
</head> <body id="body1">
<div id="div1">
<div id="div2">
<div id="div3"></div>
</div>
</div>
</body>
</html>
JS-offsetParent定位父节点的更多相关文章
- 总结获取原生JS(javascript)的父节点、子节点、兄弟节点
关于原生JS获取节点,一直是个头疼的问题,而且调用方法的名字又贼长了,所以我选择用JQ,好像跑题了-- 话不多说看代码 获取父节点 及 父节点下所有子节点(兄弟节点) <ul> <l ...
- js中获取父节点,兄弟节点及处理属性节点
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选
转载:https://www.cnblogs.com/ooo0/p/6278102.html js jquery 获取元素(父节点,子节点,兄弟节点) 一,js 获取元素(父节点,子节点,兄弟节点) ...
- javascript好文---深入理解定位父级offsetParent及偏移大小
前面的话 偏移量(offset dimension)是javascript中的一个重要的概念.涉及到偏移量的主要是offsetLeft.offsetTop.offsetHeight.offsetWid ...
- jquery 获取元素(父节点,子节点,兄弟节点),元素筛选
一, js 获取元素(父节点,子节点,兄弟节点) var test = document.getElementById("test"); var parent = test.p ...
- offsetParent() 返回第一个匹配元素用于定位的父节点。
offsetParent() V1.2.6概述 返回第一个匹配元素用于定位的父节点. 这返回父元素中第一个其position设为relative或者absolute的元素.此方法仅对可见元素有效.大理 ...
- JS获取子节点、父节点和兄弟节点的方法实例总结
转自:https://www.jb51.net/article/143286.htm 本文实例讲述了JS获取子节点.父节点和兄弟节点的方法.分享给大家供大家参考,具体如下: 一.js获取子节点的方式 ...
- 深入理解定位父级offsetParent及偏移大小
前面的话 偏移量(offset dimension)是javascript中的一个重要的概念.涉及到偏移量的主要是offsetLeft.offsetTop.offsetHeight.offsetWid ...
- JS获取与遍历节点的兄弟父级
发布:脚本学堂/JavaScript 编辑:JB01 2014-01-23 15:40:11 [大 中 小] 介绍下js获取节点的兄弟.父级与子元素的方法,学习下js遍历节点的操作方法,有需要 ...
随机推荐
- completed solution matches microsoft sequential workflow tutorial
microsoft sequential workflow tutorial website:http://msdn.microsoft.com/en-us/library/ms734794(v=vs ...
- 写了cookie阻止通过输入地址直接访问下一个html,但是直接输入地址访问时,会闪一下下一个页面,怎么回事啊????、
描述:做了两个页面login.html index.html 在index的body加了onload事件,调用一个js,js中有cookie的判断,防止没有登录就打开index.html,如果没 ...
- jquery template模版引擎
jTemplates http://jtemplates.tpython.com/ jquery-template https://github.com/codepb/jquery-template ...
- c语言-链表VS数组
数组和链表的区别 数组是将元素在内存中连续存放,由于每个元素占用内存相同,可以通过下标迅速访问数组中任何元素.但是如果要在数组中增加一个元素,需要移动大量元素,在内存中空出一个元素的空间,然后将要 ...
- eclipse安装svn和maven插件以及m2e-extras
相关介绍: 1.SVN是Subversion的简称,是一个开放源代码的版本控制系统,相较于RCS.CVS,它采用了分支管理系统,它的设计目标就是取代CVS.互联网上很多版本控制服务已从CVS迁移到Su ...
- nullcon HackIM 2016 -- Crypto Question 5
Now you are one step away from knowing who is that WARRIOR. The Fighter who will decide the fate of ...
- mongo管理工具
启动 D:\Program Files\MongoDB\Server\3.4\bin\mongod.exe --dbpath d:\data\db 还原 D:\Program Files\MongoD ...
- 【BZOJ1208】宠物收养所(平衡树,splay)
题意:见题面 思路:因为每个时刻要么全是人要么全是宠物,所以可以一棵splay解决 维护单点插入,单点删除,求前驱,求后继即可 ..,..]of longint; num,fa:..]of longi ...
- h5 摄像头处理 在线视频
http://www.360doc.com/content/08/0812/03/72059_1533104.shtml http://html5online.com.cn/articles/2012 ...
- Java 的replace和replaceAll的使用
(1)replace() 方法通过用 newChar 字符替换字符串中出现的所有 oldChar 字符,并返回替换后的新字符串. public String replace(char oldChar, ...