hx-replace-url

hx-replace-url 属性允许你替换浏览器历史记录的当前 URL 。

该属性可能的值包括：

1. true，它将替换浏览器导航栏中获取的 URL。
2. false，如果由于继承而导致获取的 URL 本来会被替换，则会禁用替换该 URL。
3. 根据要替换到地址栏的 URL，这可以是相对的，也可以是绝对的, 主要依据history.replaceState()。

以下是一个例子：

<div hx-get="/account" hx-replace-url="true">
  Go to My Account
</div>

这将导致 htmx 对当前 DOM 进行快照保存至 localStorage 并替换浏览器地址栏中的 URL “/account”。

另一个例子：

<div hx-get="/account" hx-replace-url="/account/home">
  Go to My Account
</div>

这将替换浏览器地址栏中的 URL “/account/home”。

笔记

• hx-replace-url 可以继承并放置在父元素上
• HX-Replace-Url 响应头具有类似的行为，并且可以覆盖此属性。
• 该 hx-history-elt 属性 允许更改保存在历史缓存中的元素。
• 该 hx-push-url 属性 是一个类似且更常用的属性，它创建一个新的历史记录条目而不是替换当前的条目。