javascript - 如何获取相对于滚动框的 DOM 元素 [x,y] 坐标？

Question

如何在 JavaScript 中获取 DOM 元素 [x,y] 坐标？ 具体来说，是滚动框中按钮的坐标。

我找到了这个offsetLeft属性:

var elements = scroll.children; // with 12 children
if (!elements.item(2)) {
    print("no element");
}
else if (!elements.item(2).offsetLeft) {
    print("no attribute");
}
else {
    print(elements.item(2).offsetLeft);
}

但它打印“无属性”...

顺便说一句，它适用于 Mozilla 环境。

Answer 1

尝试这样的事情:

// Based on code from http://www.quirksmode.org/js/findpos.html
function FindElementDocumentPosition(element) {
  var left = 0;
  var top = 0;
  var lastElement = element;
  if (element.offsetParent) {
    left += element.offsetLeft;
    top += element.offsetTop;
    element = element.offsetParent;
    while (element) {
      left += element.offsetLeft;
      top += element.offsetTop;
      left -= element.scrollLeft;
      top -= element.scrollTop;
      lastElement = element;
      element = element.offsetParent;
    }
  }
  // Adjust for document scroll position
  var agent = navigator.userAgent.toLowerCase();
  if (!PageInStandardsMode() || (agent.indexOf('firefox') == -1)) {
    var leftAdjust = document.body.scrollLeft || document.documentElement.scrollLeft;
    var topAdjust = document.body.scrollTop || document.documentElement.scrollTop;
    left += leftAdjust;
    top += topAdjust;
  }
  return {
    x: left,
    y: top
  };
}