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

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

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

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

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

当前回答

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

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

2009-02-08 20:52:43

其他回答

试一试:

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

clientHeight包括高度和垂直填充。

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

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

2009-02-08 20:51:45

为此，您可以使用. 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()之间的差异

2013-01-30 09:14:36

有时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;
}

2015-01-01 09:04:33

它应该只是