hx-preserve

hx-preserve 属性により、HTMLの置換中でも要素をそのまま保持できます。hx-preserve が設定された要素は、htmxが祖先の要素を更新すると、id によって保持されます。hx-preserve を機能させるには、要素に変化しない id を設定する必要があります。応答には同じ id の要素が必要ですが、その型や他の属性は無視されます。

ノート

• hx-preserve は継承されません。
• hx-preserve="true" を使用するか、hx-preserve のみを使用したboolean属性として使用できます。
• 残念なことに、<input type="text">（フォーカスとキャレット位置が失われる）、iframeまたは特定タイプのビデオなど、一部の要素は適切に保持できません。このような場合に対処するには、より詳細なDOM処理を実行するmorphdom 拡張をお勧めします。
• 履歴サポートを「戻る」ボタンなどの操作に使用する場合、hx-preserve 要素も状態が保持されます。
• hx-preserve 要素を失うのを避けるためにhx-swapを none に設定して、そのような要素を含む可能性のあるリクエストでは使用しないでください。
• hx-preserveにより、部分的なoob応答とスワップする場合、要素が現在位置から削除され、新しい位置に移動することがあります。

  <div id="new_location">
    Just relocated the video here
    <div id="video" hx-preserve></div>
  </div>
  

• hx-swap-oob要素の内部コンテンツで使用できます。

  <div id="notify" hx-swap-oob="true">
    Notification updated but keep the same retain
    <div id="retain" hx-preserve></div>
  </div>