javascript - 测量元素和窗口边距之间的长度

Question

我正在尝试测量html 元素和当前视口边框之间的像素。

例如，如果我们有一个DIV -

|--------------------------|
|                          |
|                          | 
|       |=========|        |
|   L   |   DIV   |    R   |
|<----->|         |<------>|
|       |=========|        |
|                          |
|--------------------------|

我知道如何测量当前视口，

var $w = $(window);
return {
    l: $w.scrollLeft(),
    t: $w.scrollTop(),
    w: $w.width(),
    h: $w.height() 
}

有没有办法以像素为单位获取R和L值？它不应该是元素和屏幕边框，它应该是元素和视口边框。

Answer 1

试试这个，但它会给出相对于它的父级的偏移量，所以如果它的父级是 body你会得到想要的结果，如果不是，那么也得到它的父级的偏移量并添加它

function getOffset(id)
{

    var ele = document.getElementById(id);
    var left = parseInt(ele.style.left || ele.offsetLeft);
    var right = parseInt(ele.style.right || ele.offsetRight);

    alert(left + " " +right);
}