第4章:DOM更新戦略(DOM Update Strategy)概要
サーバーから届いたHTMLを、具体的にどのように画面に反映させるかを自在に操るテクニックを学びます。配置場所、アニメーション、そして複数の場所を同時に更新する方法までを網羅します。
項目一覧
- innerHTML: 内側の入れ替え
- outerHTML: 自分自身の入れ替え
- beforebegin: 自分の直前に挿入
- afterbegin: 自分の先頭の子として挿入
- beforeend: 自分の最後の子として挿入
- afterend: 自分の直後に挿入
- delete: 要素の削除
- none: 更新しない
- Show/Scroll: フォーカス制御
- Swap Timing: 更新タイミングの調整
- Settle Timing: 安定化までの待機
- hx-select: 一部分のみの抜粋
- hx-select-oob: 複数箇所の抜粋更新
- hx-swap-oob: 流れ弾更新
- Out of Band Updates: 基本原理
- Targeting by ID: IDによる精密指定
- Targeting by CSS Selector: セレクタ指定
- Extended Selectors: 拡張セレクタ
- Auto-focus: フォーカスの自動維持
- Preserving Scroll: スクロール位置の維持
- hx-preserve: 要素の完全保護
- Transitions: 基本アニメーション
- CSS Transitions: CSSとの連携
- View Transitions API: 最新の画面遷移
- Morphing: モーフィング(滑らかな変化)
[ encyclopedia 戻る ]../README.md