getBoundingClientRect以了解元素是否在特定垂直点之上

Question

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

var rect = el.getBoundingClientRect();

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

我认为这样做效果很好，但是在一些调试中我发现有些元素会为所有顶部，底部，右侧，左侧返回0。例如：Example1和Example2

<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，并且不确定它们是否适用于非块级元素。