<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

    <div class="box1" style="position: absolute;">

        <div class="box2" style="position: fixed;">

            <div class="box3"></div>

        </div>

    </div>

<script>

    //offsetParent：复习盒子中带有定位的盒子

    //复习盒子中都没有定位，返回body

    //如果有，谁有返回最近哪个

    var box3 = document.getElementsByClassName("box3")[0];

    console.log(box3.offsetParent);

</script>

</body>

</html>

　　

03-offsetParent属性的更多相关文章

  1. JS OffsetParent属性

       offsetParent 属性返回一个对象的引用,这个对象是距离调用offsetParent的元素最近的(在包含层次中最靠近的),并且是已进行过CSS定位的容器元素. 如果这个容器元素未进行CS ...

  2. JavaScript问题——在浏览器中每一个元素都有一个offsetParent属性，这个属性是什么？

    原文链接http://www.cnblogs.com/zcjnever/archive/2011/04/21/2023133.html Javascript中的offsetParent属性 支持的浏览 ...

  3. Python web前端 03 CSS属性

    Python web前端 03 CSS属性 一.文字.文本属性 1.文字属性 font-family #字体类型浏览器默认的字体是微软雅黑,字体中有多个字体的时候,如果前面的字体没有就使用后面的字体 ...

  4. offsetParent、offsetTop、offsetLeft、offsetWidth、offsetHeight

    w3c规范,请戳这里:http://www.w3.org/TR/cssom-view/#dom-htmlelement-offsetparent 一.offsetParent 英文解读: part o ...

  5. offset、client、scroll开头的属性归纳总结

    HTML元素有几个offset.client.scroll开头的属性,总是让人摸不着头脑.在书中看到记下来,分享给需要的小伙伴.主要是以下几个属性: 第一组:offsetWidth,offsetHei ...

  6. webView 自适应高度 document.body 属性

    前段时间开发遇到webView 高度自适应问题,用最初的方法无效,找了些资料,记录下. 1.若网页中含有< !DOCTYPE html PUBLIC "-//W3C//DTD XHTM ...

  7. offsetParent的解释

    offsetParent是个只读属性,返回最近显示指定位置的容器元素的父级.如果元素没有指定位置,最近的元素或者根元素(标准模式下是html,怪异模式下是body)就是offsetParent off ...

  8. offsetTop、clientTop、scrollTop、offsetTop属性

    HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对 ...

  9. javascrip中parentNode和offsetParent之间的区别

    首先是 parentNode 属性,这个属性好理解,就是在 DOM 层次结构定义的上下级关系,如果元素A包含元素B,那么元素B就可以通过 parentElement 属性来获取元素A. 要明白 off ...

  10. JavaScript获取浏览器高度和宽度值(documentElement,clientHeight,offsetHeight,scrollHeight,scrollTop,offsetParent,offsetY,innerHeight)

    IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.d ...

随机推荐

  1. 在CentOS 6.7 64位安装PHP的PDO_OCI扩展 Installing PDO_OCI extension on CentOS 6.7 64bit

    需求&背景 最近根据项目需求,要在php中远程连接Oracel 11g Express数据库,为了开发方便,决定采用pdo,也就是php的PDO_OCI扩展,但是php安装的时候并没有安装PD ...

  2. 在webconfig放置固定值

    通常的,为了布置到服务器后修改的方便通常把一些会改变的值放在webconfig: 首先在web.ocnfig中放入如下值 <appSettings> <add key="A ...

  3. 从javaweb项目学习

    1.sql语句 在insert语句中需要插入查询出来的值. Insert into a (a1,a2,a3) values (1,select num from b where id=1,3) 这样写 ...

  4. 将centos6的php5.3升级为5.6

    在阿里云主机上,操作系统是Centos6,php版本是5.3.因为安装Yii2.0的需要,我要升级php为5.4.因为还有5.5和5.6,当然要升到高版本了.我决定升到5.6.   首先,按照这里的步 ...

  5. 洛谷 P2483 [SDOI2010]魔法猪学院

    题目描述 iPig在假期来到了传说中的魔法猪学院,开始为期两个月的魔法猪训练.经过了一周理论知识和一周基本魔法的学习之后,iPig对猪世界的世界本原有了很多的了解:众所周知,世界是由元素构成的:元素与 ...

  6. Python实现1-9数组形成的结果为100的所有运算式

    问题: 编写一个在1,2,…,9(顺序不能变)数字之间插入+或-或什么都不插入,使得计算结果总是100的程序,并输出所有的可能性.例如:1 + 2 + 34–5 + 67–8 + 9 = 100. f ...

  7. Android的Activity之间传对象的方法

    传值代码块 //Serializeable传递对象的方法 public void SerializeMethod(){ Person mPerson = new Person(); mPerson.s ...

  8. Bootstrap历练实例：超小的按钮

    <!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...

  9. Dev-Cpp 5.11 c++编译器下载

    Dev-Cpp 5.11 c++编译器下载地址: 链接: https://pan.baidu.com/s/1jHMAf1k 密码: i6nw

  10. ZOJ Monthly, January 2019-Little Sub and Pascal's Triangle

    这个题的话,它每行奇数的个数等于该行行号,如果是0开始的,就该数的二进制中的1的个数,设为k,以它作为次数,2k就是了. #include <stdio.h> int main() { i ...