关于offsetParent

关于offsetParent元素的 offsetParent 可能值 null body 元素 该元素的某个父级定位元素 为 null 的情况 1 body 元素 2 元素的 display 为 none 3 元素尚未添加到 DOM 4 元素的 position 为 fixed 为 body 元素的情况 该元素不是任何一个定位元素的后代 也不是 null 为某个父级定位元素的情况 如果此元素

元素的offsetParent可能值:null,body元素,该元素的某个父级定位元素。

 

为null的情况:

  1. body元素

  2. 元素的display为none

  3. 元素尚未添加到DOM

  4. 元素的position为fixed

为body元素的情况:

  该元素不是任何一个定位元素的后代,也不是null。

为某个父级定位元素的情况:

  如果此元素是某个定位元素的子级,离它最近的父级定位元素为此元素的offsetParent;如果此元素不是某个定位元素的子级,但其父元素中有td、th或者table,那么其offsetParent为上述元素。

 

获取元素相对于页面的位置:

function(elem) { if (elem.getBoundingClientRect) { //HTML5 method var box = elem.getBoundingClientRect(); var body = document.body; var docElem = document.documentElement; var scrollTop = window.pageYOffset || docElem.scrollTop || body.scrollTop; var scrollLeft = window.pageXOffset || docElem.scrollLeft || body.scrollLeft; var clientTop = docElem.clientTop || body.clientTop || 0; var clientLeft = docElem.clientLeft || body.clientLeft || 0; var top = box.top + scrollTop - clientTop; var left = box.left + scrollLeft - clientLeft; return { y: Math.round(top), x: Math.round(left), width:elem.offsetWidth, height:elem.offsetHeight }; } else { //fallback to naive approach var top=0, left=0; while(elem) { top = top + parseInt(elem.offsetTop,10); left = left + parseInt(elem.offsetLeft,10); elem = elem.offsetParent; } return { y: top, x: left, width:elem.offsetHeight, height:elem.offsetWidth }; } } 

  

 

转载于:https://www.cnblogs.com/ywxgod/p/6481247.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/221407.html原文链接:https://javaforall.net

(0)
上一篇 2026年3月17日 下午6:11
下一篇 2026年3月17日 下午6:11


相关推荐

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号