javascript 要素追加後の高さ

質問

$("div").append("要素");

で要素を追加した後の親要素divの高さは、実際に要素を追加して結果の要素の高さをみる、もしくはどういう構造になるか計算して高さを事前に計算する以外に手はないでしょうか？

要素追加前に親要素の高さをアニメーションで大きくして、その後要素を追加したいです。

回答No.1

shinji000

内容から察するに$("div")にはあらかじめピッタリサイズでheightが設定されていると思います。
それを前提に考えると
対象のdivにid="box"を付けて
<style>
#box { overflow: hidden; }
</style>
としておいて
$('#box').append('要素').animate({height: $('#box')[0].scrollHeight});
でどうでしょうか？
要素を追加してからアニメーションしているので希望の処理とは違いますが。

heightを設定してない場合は
$('#box').append('<div style="display:none" />')
.children('div:last').append('要素').slideDown();
不要な<div>が残りますが上と同じような動作をします。