gpt4 book ai didi

javascript - 什么会使 offsetParent 为空?

转载 作者:技术小花猫 更新时间:2023-10-29 12:28:21 28 4
gpt4 key购买 nike

我正在尝试用 JavaScript 进行定位。我正在使用基于 classic quirksmode function 的累积头寸函数将每个 offsetParentoffsetTopoffsetLeft 相加,直到顶部节点。

但是,我遇到了一个问题,我感兴趣的元素在 Firefox 中没有 offsetParent。在 IE 中 offsetParent 存在,但是 offsetTopoffsetLeft 总和为 0,因此它与 Firefox 中的效果相同。

什么会导致屏幕上清晰可见且可用的元素没有 offsetParent?或者,更实际地说,我如何才能找到该元素的位置以便在其下方放置一个下拉菜单?

编辑:以下是重现此问题的一个特定实例的方法(当前接受的答案未解决):

  1. 打开 home page of Stack Overflow .
  2. 在网络浏览器(例如 Chromev21)的控制台中运行以下代码:

    var e = document.querySelector('div');
    console.log(e);
    // <div id="notify-container"></div>
    do{
    var s = getComputedStyle(e);
    console.log(e.tagName,s.display,s.visibility,s.position,e.offsetParent);
    } while(e=e.parentElement)
    // DIV block visible fixed null
    // BODY block visible static null
    // HTML block visible static null

为什么该元素的 offsetParent null

最佳答案

我做了a test of 2,304 divs具有 position 值的独特组合, display , 和 visibility ,嵌套在每个值的唯一组合中,并确定:

否则有效的元素
那是 <body> 的后代
不会有 offsetParent值如果:

  • 元素有position:fixed (Webkit 和 IE9)
  • 元素有display:none (Webkit 和 FF)
  • 任何祖先都有display:none (Webkit 和 FF)

同样可以合理预期没有父元素或未添加到页面本身的元素(不是页面的 <body> 的后代)也将具有 offsetParent==null .

关于javascript - 什么会使 offsetParent 为空?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/306305/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com