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定位父节点的更多相关文章

  1. 总结获取原生JS(javascript)的父节点、子节点、兄弟节点

    关于原生JS获取节点,一直是个头疼的问题,而且调用方法的名字又贼长了,所以我选择用JQ,好像跑题了-- 话不多说看代码 获取父节点 及 父节点下所有子节点(兄弟节点) <ul> <l ...

  2. js中获取父节点,兄弟节点及处理属性节点

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  3. js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选

    转载:https://www.cnblogs.com/ooo0/p/6278102.html js jquery 获取元素(父节点,子节点,兄弟节点) 一,js 获取元素(父节点,子节点,兄弟节点) ...

  4. javascript好文---深入理解定位父级offsetParent及偏移大小

    前面的话 偏移量(offset dimension)是javascript中的一个重要的概念.涉及到偏移量的主要是offsetLeft.offsetTop.offsetHeight.offsetWid ...

  5. jquery 获取元素(父节点,子节点,兄弟节点),元素筛选

    一, js 获取元素(父节点,子节点,兄弟节点)   var test = document.getElementById("test"); var parent = test.p ...

  6. offsetParent() 返回第一个匹配元素用于定位的父节点。

    offsetParent() V1.2.6概述 返回第一个匹配元素用于定位的父节点. 这返回父元素中第一个其position设为relative或者absolute的元素.此方法仅对可见元素有效.大理 ...

  7. JS获取子节点、父节点和兄弟节点的方法实例总结

    转自:https://www.jb51.net/article/143286.htm 本文实例讲述了JS获取子节点.父节点和兄弟节点的方法.分享给大家供大家参考,具体如下: 一.js获取子节点的方式 ...

  8. 深入理解定位父级offsetParent及偏移大小

    前面的话 偏移量(offset dimension)是javascript中的一个重要的概念.涉及到偏移量的主要是offsetLeft.offsetTop.offsetHeight.offsetWid ...

  9. JS获取与遍历节点的兄弟父级

    发布:脚本学堂/JavaScript  编辑:JB01   2014-01-23 15:40:11  [大 中 小] 介绍下js获取节点的兄弟.父级与子元素的方法,学习下js遍历节点的操作方法,有需要 ...

随机推荐

  1. underscore.js库的浅析

    Underscore并没有在原生的JavaScript对象原型中进行扩展,而是像jQuery一样,将数据封装在一个自定义对象中(下文称“Underscore对象”).生成一个Underscore对象: ...

  2. 在 Windows 環境下利用 VNC 遠端控管 Mac OS X Server

    Mac OS Server 可以使用 VNC 來遠端控管.不過,在 Mac 上打開這個功能很簡單,要讓 Windows 的 VNC Viewer 連上卻很難,原來是有原因的. 首先我們來看怎麼在 Ma ...

  3. google垂直搜索结果

    佰年金融 所谓“垂直”很干净地分离出来,而不是在谷歌算作有机列表的结果,但该行已开始模糊.例如,现在许多视频结果似乎是直接整合为有机(万SERP的例子).我治疗的新的“有深度的文章”作为一个垂直的结果 ...

  4. CSS3 background-size 属性

    http://www.w3school.com.cn/cssref/pr_background-size.asp

  5. [Docker] docker 基础学习笔记2（共6篇）

    febootstrap 是一个自制image的一个第三方的工具,好像他们现在都要用这个.   安装还是挺方便的. yum -y install febootstrap   febootstrap -i ...

  6. 401 Not Authorized For MSDEPLOY‏ (msdeployAgentService)

    When you get this error from msdeploy:“Error: The remote server returned an error: (401) Unauthorize ...

  7. JSP中的 HttpSession、pageContext对象

    pageContext 隐含对象对应javax.servlet.jsp.PageContext,都自动的被加入至pageContext中, 您可以由它来取得与JSP相关的对应之Servlet对象,像是 ...

  8. Light OJ 1031 - Easy Game(区间dp）

    题目链接:http://www.lightoj.com/volume_showproblem.php?problem=1031 题目大意:两个选手,轮流可以从数组的任意一端取值, 每次可以去任意个但仅 ...

  9. 关于display：flex

    遇到了一个bug 就是display:flex   遇到的bug原型就是,项目容器的diaplay:flex ,一行项目五个,到最后一行只剩两个的时候 是两端对齐的,如果再添加的话 也就是两端各一个子 ...

  10. Python：socket

    Socket:又称"套接字",应用程序通常通过"套接字"向网络发出请求或者应答网络请求,使主机间或者一台计算机上的进程间可以通讯. socket()函数 Pyt ...