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遍历节点的操作方法,有需要 ...
随机推荐
- C++ MFC打开文件的流程
打开文件的步骤如下: 弹出打开文件对话框 -> 获取选择的文件,并将文件显示在视图中. 我们程序中经常需要定制的操作如下: 1. 定制弹出的文件对话框,例如需要修改打开文件的类型或扩展名 2. ...
- CSharper 学Quick-Cocos2d-X (一) 开发环境的搭建
前言 本来想写CSharper 学Cocos2dx系列的.但是最近在了解许多跨平台游戏开发框架后 最终决定使用Quick-cocos2d-x+lua进行第一个游戏项目的开发.经过一天多的折腾 终于 ...
- 三张图片详解Asp.Net 全生命周期
用三张图片详解Asp.Net 全生命周期 下面我们使用三张图片解析ASP.net的整个生命周期,我总感觉使用图片更加的清楚的说明这种问题,所以使用的这样方式 说明: 1 第一张图片从全局说明从客户端 ...
- 全面的Seo面试题
一.选择题(每题2分,2分×10=20分) 1.白帽SEO诞生日是: A .1997年9月15日 :B .2004年12月13日:C.2005年3月26日:D.2009年6月1日 2.一个做女性服 ...
- Magento1.9批量修改产品 Attribute Set
今天修改产品时遇到这样一个需求:重新设置产品的 Attribute Set,使用的是Magento1.9系统,Magento提供这样一个插件 Flagbit Change Attribute Set: ...
- Java对象的序列化和反序列化
对象的序列化是指将对象转换为字节序列的过程 对象的反序列化是指将字节序列恢复对象的过程 主要有两种用途: 1.把对象的字节序列永久地保存在硬盘上,通常放在一个文件中. 2.在网络上传输对象的字节序列. ...
- logback 配置详解(一)
一:根节点<configuration>包含的属性: scan: 当此属性设置为true时,配置文件如果发生改变,将会被重新加载,默认值为true. scanPeriod: 设置监测配置文 ...
- 【好文要转】HTTP图解(大牛必经之路)
http://www.cnblogs.com/aylin/p/6221436.html
- TOMCAT的安装部署配置(配图解)
TOMCAT的安装部署配置 前提已经成功搭建配置JDK 下载好压缩包后,直接解压至某一目录下,目录中不能包含中文 双击安装文件,出现如下界面 点击[NEXT],出现如下界面 点击[I AGREE],出 ...
- sql.date and util.Date
注意: 1.用 bean 接受 数据库查询的结果 sql.date 会自动转换为 util.date 2.想数据库插入date 类型,必须是要 sql.date 一.字符串 转 util.date S ...