hx-swap

スワップは「交換」という意味を持ち、取得した要素をどこに挿入するのか指定することができます。
デフォルトは「innerHTML」です。

hx-swapの値を変更する

対象のコード

<button hx-get="/sample01.php" hx-swap="innerHTML">クリック!!</button>

sample01.php

<span style="color: blue;">サンプル1</span>

オプション（下記以外のオプションも存在します）

innerHTML: 対象要素の内部HTMLを置き換えます。（default）
outerHTML: ターゲット要素全体を置き換えます。
afterbegin: ターゲット内の最初の子の前にコンテンツを追加します。
beforebegin: ターゲットの親要素のターゲットの前にコンテンツを追加します。
beforeend: ターゲット内の最後の子の後にコンテンツを追加します。
afterend: ターゲット親要素のターゲットの後にコンテンツを追加します。
delete: 応答に関係なくターゲット要素を削除します。
none: 応答からコンテンツを追加しません。