我正在尝试用 JavaScript 进行定位。我正在使用基于 classic quirksmode function 的累积头寸函数将每个 offsetParent 的 offsetTop 和 offsetLeft 相加，直到顶部节点。
但是，我遇到了一个问题，我感兴趣的元素在 Firefox 中没有 offsetParent。在 IE 中 offsetParent 存在，但是 offsetTop 和 offsetLeft 总和为 0，因此它与 Firefox 中的效果相同。
什么会导致屏幕上清晰可见且可用的元素没有 offsetParent？或者，更实际地说，我如何才能找到该元素的位置以便在其下方放置一个下拉菜单？
编辑:以下是重现此问题的一个特定实例的方法(当前接受的答案未解决):
- 打开 home page of Stack Overflow .
在网络浏览器(例如 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/