エレメントレンダリング」イベントはありますか？

質問

ウェブアプリ内のテキストの寸法を正確に測定する必要がありますが、そのためには、（関連するCSSクラスで）要素を作成し、その innerHTML を設定し、それをコンテナに追加して appendChild .

これを実行した後、要素がレンダリングされるまでに待ち時間があり、その間に offsetWidth が読み込まれ、テキストの幅を知ることができます。

現在、私は setTimeout(processText, 100) を使用して、レンダリングが完了するまで待機しています。

私が作成した要素がレンダリングされたときに、私が聞くことができるコールバック、またはより信頼性の高い方法はありますか？

どのように解決するのですか?

現在、要素が完全にレンダリングされたことを示す DOM イベントはありません (例: 付属の CSS が適用されて描画される)。このため、一部の DOM 操作コードが間違った、またはランダムな結果を返すことがあります (要素の高さを取得するような場合)。

setTimeout を使用して、レンダリングのためのオーバーヘッドをブラウザに与えるのが最も簡単な方法です。使用方法

setTimeout(function(){}, 0)

はおそらく最も実用的な方法で、あなたのコードをアクティブなブラウザのイベントキューの最後に、それ以上の遅延なく配置します。