次の操作のうち、ReflowとRepaintの両方が発生するのはどれですか?
- 背景色の変更
- テキストの内容変更により高さが変わる場合
- コンソール出力
- フォーカスの移動
正解
- テキストの内容変更により高さが変わる場合
解説
テキスト変更で高さが変わる場合、レイアウト計算(Reflow)と再描画(Repaint)の両方が必要になります。
使用例(サンプルコード)
[ javascript ]
const box = document.getElementById("box");
box.textContent = "とても長いテキストを追加した結果、要素の高さが変わる";