您可以像这样在不遍历 DOM 的情况下获得top和left：

function getCoords(elem) { // crossbrowser version
    var box = elem.getBoundingClientRect();

    var body = document.body;
    var docEl = document.documentElement;

    var scrollTop = window.pageYOffset || docEl.scrollTop || body.scrollTop;
    var scrollLeft = window.pageXOffset || docEl.scrollLeft || body.scrollLeft;

    var clientTop = docEl.clientTop || body.clientTop || 0;
    var clientLeft = docEl.clientLeft || body.clientLeft || 0;

    var top  = box.top +  scrollTop - clientTop;
    var left = box.left + scrollLeft - clientLeft;

    return { top: Math.round(top), left: Math.round(left) };
}

您可以使用element.getBoundingClientRect()检索相对于视口的元素位置。

然后用于document.documentElement.scrollTop计算视口偏移。

两者之和将给出元素相对于文档的位置：

element.getBoundingClientRect().top + document.documentElement.scrollTop

您可以遍历offsetParent到 DOM 的顶层。

function getOffsetLeft( elem )
{
    var offsetLeft = 0;
    do {
      if ( !isNaN( elem.offsetLeft ) )
      {
          offsetLeft += elem.offsetLeft;
      }
    } while( elem = elem.offsetParent );
    return offsetLeft;
}

我发现以下方法在处理触发 offsetTop/offsetLeft 的边缘情况时是最可靠的。

function getPosition(element) {
    var clientRect = element.getBoundingClientRect();
    return {left: clientRect.left + document.body.scrollLeft,
            top: clientRect.top + document.body.scrollTop};
}

我建议使用

element.getBoundingClientRect()

正如这里所建议的， 而不是通过offsetLeft、offsetTop和offsetParent手动计算偏移量。如提出这里 在某些情况下*手动遍历产生无效的结果。看到这个Plunker：http ://plnkr.co/pC8Kgj

*当元素位于具有静态（=默认）定位的可滚动父级内时。