javascript - 如何在不使用事件的情况下获取元素的 pageX 和 pageY

Question

有没有不使用 e.pageX 和 e.pageY 来定位任何元素的方法？

检查这个fiddle

fiddle 实际上是对我要问的问题的一次糟糕尝试，但我认为一个视觉示例会更好。我想知道的是，是否可以通过引用

找到 DOM 上任何元素的 X 和 Y 坐标

 document.getElementByID('elementID');

或者也许

document.getElementsByTagName('TagName');

编辑:虽然我在 FIDDLE 中使用了 Jquery，但我想要一个仅使用 JavaScript 的可能解决方案。

Answer 1

你可以使用

document.getElementById("elementID").offsetTop;
document.getElementById("elementID").offsetLeft;

引用MDN .它们返回父元素的偏移量。如果您需要元素相对于整个 body 的偏移量，它可能会变得更加棘手，因为您必须对链中每个元素的偏移量求和。
分别用于 .getElementsByTagName，因为 DOM 中的每个对象都具有这些属性。

.getBoundingClientRect 也是 worth a look .

var clientRectangle = document.getElementById("elementID").getBoundingClientRect();
console.log(clientRectangle.top); //or left, right, bottom