如何获得元素的渲染高度?
假设你有一个<div>元素，里面有一些内容。里面的内容将扩展<div>的高度。当你没有显式地设置高度时，你如何获得“渲染”的高度。显然，我尝试过:
var h = document.getElementById('someDiv').style.height;
这样做有什么诀窍吗?如果有帮助的话，我正在使用jQuery。
当前回答
非JQUERY，因为有一堆链接使用element .style.height在这些答案的顶部…
内部高度: https://developer.mozilla.org/en-US/docs/Web/API/Element.clientHeight
document.getElementById(id_attribute_value).clientHeight;
外高度: https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.offsetHeight
document.getElementById(id_attribute_value).offsetHeight;
或者是我最喜欢的参考资料之一:http://youmightnotneedjquery.com/
其他回答
为此，您可以使用. outerheight()。
它会给你元素的完整渲染高度。此外，您不需要设置元素的css-height。为预防起见，你可以保持它的高度自动，这样它就可以根据内容的高度来渲染。
//if you need height of div excluding margin/padding/border
$('#someDiv').height();
//if you need height of div with padding but without border + margin
$('#someDiv').innerHeight();
// if you need height of div including padding and border
$('#someDiv').outerHeight();
//and at last for including border + margin + padding, can use
$('#someDiv').outerHeight(true);
想要更清楚地了解这些函数，你可以访问jQuery的网站或这里的详细文章。
它将清除.height() / innerHeight() / outerHeight()之间的差异
我做了一个简单的代码，甚至不需要JQuery，可能会帮助一些人。 它在加载后得到ID1的总高度并在ID2上使用它
function anyName(){
var varname=document.getElementById('ID1').offsetHeight;
document.getElementById('ID2').style.height=varname+'px';
}
然后设置主体来加载它
<body onload='anyName()'>
非JQUERY，因为有一堆链接使用element .style.height在这些答案的顶部…
内部高度: https://developer.mozilla.org/en-US/docs/Web/API/Element.clientHeight
document.getElementById(id_attribute_value).clientHeight;
外高度: https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.offsetHeight
document.getElementById(id_attribute_value).offsetHeight;
或者是我最喜欢的参考资料之一:http://youmightnotneedjquery.com/
我用它来获取一个元素的高度(返回浮点数):
document.getElementById('someDiv').getBoundingClientRect().height
当您使用虚拟DOM时，它也可以工作。我在Vue中这样使用它:
this.$refs['some-ref'].getBoundingClientRect().height
对于Vue组件:
this.$refs['some-ref'].$el.getBoundingClientRect().height
试一试:
var h = document.getElementById('someDiv').clientHeight;
var h = document.getElementById('someDiv').offsetHeight;
var h = document.getElementById('someDiv').scrollHeight;
clientHeight包括高度和垂直填充。
offsetHeight包括高度、垂直填充和垂直边框。
scrollHeight包括所包含文档的高度(在滚动的情况下会大于高度)、垂直填充和垂直边框。
