如何获得元素的渲染高度?
假设你有一个<div>元素,里面有一些内容。里面的内容将扩展<div>的高度。当你没有显式地设置高度时,你如何获得“渲染”的高度。显然,我尝试过:
var h = document.getElementById('someDiv').style.height;
这样做有什么诀窍吗?如果有帮助的话,我正在使用jQuery。
如何获得元素的渲染高度?
假设你有一个<div>元素,里面有一些内容。里面的内容将扩展<div>的高度。当你没有显式地设置高度时,你如何获得“渲染”的高度。显然,我尝试过:
var h = document.getElementById('someDiv').style.height;
这样做有什么诀窍吗?如果有帮助的话,我正在使用jQuery。
当前回答
MooTools:
$ (' someDiv ') .getSize .y ()
其他回答
MooTools:
$ (' someDiv ') .getSize .y ()
你在css中设置高度了吗?如果你没有,你需要使用offsetHeight;而不是身高
var h = document.getElementById('someDiv').style.offsetHeight;
有时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;
}
非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/
试一试:
var h = document.getElementById('someDiv').clientHeight;
var h = document.getElementById('someDiv').offsetHeight;
var h = document.getElementById('someDiv').scrollHeight;
clientHeight包括高度和垂直填充。
offsetHeight包括高度、垂直填充和垂直边框。
scrollHeight包括所包含文档的高度(在滚动的情况下会大于高度)、垂直填充和垂直边框。