hx-preserve

hx-preserve 属性允许您在 HTML 替换期间保持元素不变。 设置了 hx-preserve 的元素在 htmx 更新任何祖先元素时会通过 id 保留。 您必须在元素上设置一个不变的 id，才能使 hx-preserve 工作。 响应需要一个具有相同 id 的元素，但其类型和其他属性将被忽略。

备注

• hx-preserve 不会被继承
• 您可以使用 hx-preserve="true" 或者将其用作布尔属性，只需 hx-preserve
• 不幸的是，某些元素无法正确保留，例如 <input type="text">（焦点和光标位置会丢失）、iframe 或某些类型的视频。 为了解决这些情况，我们建议使用 morphdom 扩展，它会执行更详细的 DOM 协调
• 当使用 历史支持 来执行诸如后退按钮之类的操作时，hx-preserve 元素也将保留其状态
• 避免将 hx-swap 设置为 none，同时使用可能包含 hx-preserve 元素的请求，以避免丢失它
• 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>