我用它来获取一个元素的高度(返回浮点数):

document.getElementById('someDiv').getBoundingClientRect().height

当您使用虚拟DOM时，它也可以工作。我在Vue中这样使用它:

this.$refs['some-ref'].getBoundingClientRect().height

对于Vue组件:

this.$refs['some-ref'].$el.getBoundingClientRect().height

如果我正确理解了你的问题，那么也许这样做会有所帮助:

function testDistance(node1, node2) {
    /* get top position of node 1 */
    let n1Pos = node1.offsetTop;
    /* get height of node 1 */
    let n1Height = node1.clientHeight;
    /* get top position of node 2 */
    let n2Pos = node2.offsetTop;
    /* get height of node 2 */
    let n2Height = node2.clientHeight;

    /* add height of both nodes */
    let heightTogether = n1Height + n2Height;
    /* calculate distance from top of node 1 to bottom of node 2 */
    let actualDistance = (n2Pos + n2Height) - n1Pos;

    /* if the distance between top of node 1 and bottom of node 2
       is bigger than their heights combined, than there is something between them */
    if (actualDistance > heightTogether) {
        /* do something here if they are not together */
        console.log('they are not together');
    } else {
        /* do something here if they are together */
        console.log('together');
    } 
}

offsetHeight,通常。

如果你需要计算一些东西，但不显示它，将元素设置为visibility:hidden和position:absolute，将它添加到DOM树，获取offsetHeight，然后删除它。(这就是上次我检查的原型库在幕后所做的工作)。

试一试:

var h = document.getElementById('someDiv').clientHeight;
var h = document.getElementById('someDiv').offsetHeight;
var h = document.getElementById('someDiv').scrollHeight;

clientHeight包括高度和垂直填充。

offsetHeight包括高度、垂直填充和垂直边框。

scrollHeight包括所包含文档的高度(在滚动的情况下会大于高度)、垂直填充和垂直边框。

有时offsetHeight会返回0，因为您创建的元素还没有在Dom中呈现。在这种情况下，我写了这个函数:

function getHeight(element)
{
    var e = element.cloneNode(true);
    e.style.visibility = "hidden";
    document.body.appendChild(e);
    var height = e.offsetHeight + 0;
    document.body.removeChild(e);
    e.style.visibility = "visible";
    return height;
}

你在css中设置高度了吗?如果你没有，你需要使用offsetHeight;而不是身高

var h = document.getElementById('someDiv').style.offsetHeight;