jQuery获得一个元素的渲染高度?

如何获得元素的渲染高度?

假设你有一个<div>元素，里面有一些内容。里面的内容将扩展<div>的高度。当你没有显式地设置高度时，你如何获得“渲染”的高度。显然，我尝试过:

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

这样做有什么诀窍吗?如果有帮助的话，我正在使用jQuery。

当前回答

offsetHeight,通常。

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

其他回答

我做了一个简单的代码，甚至不需要JQuery，可能会帮助一些人。它在加载后得到ID1的总高度并在ID2上使用它

function anyName(){
    var varname=document.getElementById('ID1').offsetHeight;
    document.getElementById('ID2').style.height=varname+'px';
}

然后设置主体来加载它

<body onload='anyName()'>

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

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

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

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

对于Vue组件:

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

document.querySelector('.project_list_div').offsetHeight;

style = window.getComputedStyle(your_element);

然后简单地:style.height

MooTools:

$ (' someDiv ') .getSize .y ()

推荐文章