如何在不使用jQuery重新计算布局的情况下操作元素

Question

我有很多div元素，我需要重新计算它们的高度。 divs在id =“content”的另一个div里面。

我使用jQuery这样的：

$("#content div").css("height", "*=" + Math.random()); 

大约有1000左右的div被重新计算这样。这需要一些时间来做到这一点，我知道这是因为每个元素的布局都会重新计算一次。它只需要几秒钟，但它是多方面的。

我有一个关于使用常规JavaScript文档片段的提示。我很想能够使用jQuery来做到这一点。

有没有什么办法，使用jQuery，将它们分开并在写入之前在活动DOM之外操作它们，以便布局在我完成操作之前不会被重新计算？

Answer 1

尝试使用detach类似以下内容：

HTML

<div id="content" > 
    <div class="test" style="height:100px;"> 
</div> 
    <div class="test" style="height:100px;"> 
</div> 
    <div class="test" style="height:100px;"> 
</div> 
    <div class="test" style="height:100px;"> 
</div> 
    <div class="test" style="height:100px;"> 
</div> 

jQuery的

var el = $('.test').detach(); 
el.each(function(index){ 
    var height = $(this).attr('style').substring($(this).attr('style').indexOf('height:')+7,$(this).attr('style').indexOf('px')); 
    $(this).attr('style','height:'+height*Math.random()+'px'); 
}); 
$('#content').append(el); 

我有麻烦的分离元件操纵的高度。我确实发现一种做法，虽然如果你有风格att的高度ribute你可以从那里获取信息并操纵它。

下面是一个例子，希望对您有所帮助。

http://jsfiddle.net/4Sb8T/