Javascript 测量页外元素的高度

我在元素方面做得很好。我想根据它们的高度来决定把它们放在哪里（想想盒子包装类型算法）

当我这样循环我的元素时，对于

outerHeight

，我总是得到

0

：

posts.each(function(i, e) {
    var elementHeight = $(e).outerHeight();
    // elementHeight is always 0
});

如何获取元素的显示高度

---

似乎我必须将元素添加到页面以获得高度，这很有意义。

---

在尽可能简单地对用户不可见的情况下，最好的方法是什么？

您必须将元素添加到页面中，以便它们经过布局过程，然后它们将有一个大小

可以将它们添加到主体中，获取高度，然后删除它们。当元素位于页面中时，浏览器正忙于运行代码，因此这些元素将永远不会显示：

var el = $('<div>test</div>');
$(document.body).append(el);
var h = el.height();
el.remove();

var el=$（'test'）；
$（document.body）.append（el）；
var h=标高高度（）；
el.移除（）；

将帖子附加到

隐藏的

（display:none）div元素，然后迭代它们以获得各自的

outerHeight

值

HTML

<div id="postContainer"></div>

JS

#postContainer { display: none;}

var cont = $('#postContainer'), postsLength = posts.length;
posts.each(function(i, e) {
    cont.append(e);
    if (!--postsLength) calcOuterHeight();
});

function calcOuterHeight(){
    cont.find('.posts').each(function(i, e){
        var oh = $(e).outerHeight();
    })
}

---

在用户看不见的情况下，我如何做到这一点？我可以用-1000加上它们，然后查询高度，然后把它们移到我想要的地方吗？（没有任何计时器等？）+1那么，根据OP的要求，如果不将元素添加到页面中，他如何计算高度？@ElRonnoco:不起作用，我想我需要一个回调来刷新布局。@geogeduckett:您可以将元素添加到页面中，获取它们的高度，然后删除它们。这样，他们将经历布局过程，但在元素消失之前，UI不会更新以显示该元素。示例：我刚刚尝试添加到现有元素，但无法直接查询高度，我想需要一个计时器/回调。更新我的代码以添加一个

outerHeight

函数，该函数仅在将所有

帖子添加到容器后才执行。