javascript - getBoundingClientRect 以了解元素是否高于特定垂直点

Question

我正在使用 getBoundingClientRect 来了解元素是否高于页面中的特定点。所以我这样做：

var rect = el.getBoundingClientRect();

if (rect.top < bottom_limit) {
   return true;
}

我认为这工作得很好，但在一些调试中我发现有些元素对于所有顶部、底部、右侧、左侧都返回 0。例如：示例 1和示例 2

<span id='a'>
    <span id='b'>This is some crazy text.</span>
</span>

#b {
    float: left;
}

和

#b {
    position: absolute;
}

我担心得到全零。为什么会这样？我可以相信这种方法来完成我想要完成的事情吗？

Answer 1

您可以考虑使用 document.getBoxObjectFor(el)，或尝试 el.offsetTop/offsetLeft/offsetWidth/offsetHeight。认为它们可能只是 Mozilla，但不确定它们是否适用于非块级元素。