谢谢你的回答。Prototype似乎已经有了这样一个函数(page()函数)。通过查看该函数的源代码，我发现它首先计算相对于页面的元素偏移位置(即文档顶部)，然后从中减去scrollTop。更多细节请参见原型的源代码。

现有的答案现在已经过时了。原生的getBoundingClientRect()方法已经存在很长一段时间了，它所做的正是问题所要求的。此外，所有浏览器都支持它(似乎包括IE 5 !)

来自MDN页面:

返回值是一个TextRectangle对象，它包含以像素为单位的描述边界框的只读左、上、右和下属性，其中左上角相对于viewport的左上角。

你可以这样使用它:

var viewportOffset = el.getBoundingClientRect();
// these are relative to the viewport, i.e. the window
var top = viewportOffset.top;
var left = viewportOffset.left;

有时getBoundingClientRect()对象的属性值在IE中显示为0。在这种情况下，你必须为元素设置display = 'block'。您可以使用下面的代码为所有浏览器获得偏移。

扩展jQuery功能:

(function($) {
    jQuery.fn.weOffset = function () {
        var de = document.documentElement;
        $(this).css("display", "block");
        var box = $(this).get(0).getBoundingClientRect();
        var top = box.top + window.pageYOffset - de.clientTop;
        var left = box.left + window.pageXOffset - de.clientLeft;
        return { top: top, left: left };
    };
}(jQuery));

使用:

var elementOffset = $("#" + elementId).weOffset();

var element =  document.querySelector('selector');
var bodyRect = document.body.getBoundingClientRect(),
    elemRect = element.getBoundingClientRect(),
    offset   = elemRect.top - bodyRect.top;

编辑:添加一些代码来处理页面滚动。

function findPos(id) {
    var node = document.getElementById(id);     
    var curtop = 0;
    var curtopscroll = 0;
    if (node.offsetParent) {
        do {
            curtop += node.offsetTop;
            curtopscroll += node.offsetParent ? node.offsetParent.scrollTop : 0;
        } while (node = node.offsetParent);

        alert(curtop - curtopscroll);
    }
}

id参数是你想要偏移量的元素的id。改编自一个奇怪的帖子。

jQuery非常优雅地实现了这一点。如果你查看jQuery的偏移量的源代码，你会发现它基本上是这样实现的:

var rect = elem.getBoundingClientRect();
var win = elem.ownerDocument.defaultView;

return {
    top: rect.top + win.pageYOffset,
    left: rect.left + win.pageXOffset
};