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

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

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

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

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

当前回答

如果你已经在使用jQuery，你最好的选择是. outerheight()或.height()，如上所述。

没有jQuery，你可以检查使用的box-sizing和添加各种填充+边框+ clientHeight，或者你可以使用getComputedStyle:

罗马，档案。

H现在是一个字符串，比如" 538.25 px"。

我找不到引用，但我听说getComputedStyle()很昂贵，所以它可能不是你想在每个窗口调用的东西。onscroll事件(但是，也不是jQuery的height())。

2014-03-25 16:24:56

其他回答

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

style = window.getComputedStyle(your_element);

然后简单地:style.height

2017-02-11 21:12:53

MooTools:

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

2009-02-13 00:09:08

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

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

然后设置主体来加载它

<body onload='anyName()'>

2012-07-31 13:55:18

一定使用

$('#someDiv').height()   // to read it

$('#someDiv').height(newHeight)  // to set it

我把这个作为一个额外的答案，因为我刚刚学到一些重要的东西。

我差点掉进了刚才使用offsetHeight的陷阱。事情是这样的:

我使用了使用调试器的老技巧来“观察”我的元素具有哪些属性我看到了哪个值在我期望的值附近它是offsetHeight，所以我用了它。然后我意识到它不工作与隐藏DIV 我试着在计算maxHeight后隐藏，但看起来笨拙-弄得一团糟。我搜索了一下——发现了jQuery.height()——并使用了它发现height()甚至适用于隐藏元素只是为了好玩，我检查了高度/宽度的jQuery实现

以下只是其中的一部分:

Math.max(
Math.max(document.body["scroll" + name], document.documentElement["scroll" + name]),
Math.max(document.body["offset" + name], document.documentElement["offset" + name])
)

是的，它既看滚动和偏移。如果失败了，考虑到浏览器和css兼容性问题，它会进一步考虑。换句话说，那些我不关心或者不想关心的东西。

但我不需要。由于jQuery !

这个故事的寓意是:如果jQuery为某件事提供了一个方法，那么它可能有一个很好的理由，很可能与兼容性有关。

如果你最近还没有通读jQuery的方法列表，我建议你看一看。

2009-02-13 03:55:08

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

推荐文章

最新文章

标签