我正在尝试确定了解一个元素相对于另一个元素的“视觉”位置(而不是 DOM 树位置)的最佳方法。
例如，我有一个元素数组，并且有一个选定的元素，并且想知道其中哪些元素在视觉上位于选定元素的右侧。
另请注意，元素可以是任何标记类型，并且可以具有任何位置(相对、绝对、固定)和显示(只要它可见)。
欢迎任何 jQuery 解决方案。
最佳答案
为什么不简单地使用 element.offsetTop 和 element.offsetLeft，其中 offsetTop 是 y 轴，offsetLeft code> 是 x 轴。
根本不需要 jQuery，不过如果你坚持 $(element).offset(); 可能就可以了。
请注意，窗口的左上角是 0-0 点。 “粘”在左边的元素将具有 offsetLeft === 0，粘在顶部的元素将具有 offsetTop === 0。这就是全部了，真的
回应zeaklous的评论:
要获取对象的尺寸:
var dimension = {top: {x: element.offsetLeft, y: element.offsetTop},
bottom: {x: element.offsetWidth, y: element.offsetHeight}
};
请注意，在 DOM 刚刚重绘的某些情况下，offsetWidth 和 offsetHeight 已知会返回 0(从您已绘制的元素获取这些属性)只是改变就会导致这种情况)。
为了避免这种情况，有些人在获取他们怀疑可能刚刚被更改的元素的偏移量时倾向于使用 setTimeout();。
在回复评论时，有人指出您可以简单地使用 getBoundingClientRect 来避免 offsetX 属性出现任何问题:
document.getElementById('foo').getBoundingClientRect();
这会返回一个 ClientRect 对象的实例，您可以使用它进行游戏。 Check MDN for details
关于javascript - 如何确定 HTML 元素在视觉上是否位于另一个元素的左侧、右侧、顶部或底部？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17352214/