hx-boost

hx-boost 属性允许您将普通的锚点和表单标签“提升”为使用 AJAX。这具有优雅的回退的优点，即如果用户没有启用 JavaScript，站点仍将正常工作。

对于锚点标签，点击锚点将向 href 中指定的 URL 发出 GET 请求，并推送 URL 以创建历史记录条目。目标是 <body> 标签，默认使用 innerHTML 交换策略。所有这些都可以通过使用适当的属性进行修改，除了 click 触发器。

对于表单，请求将根据 method 属性中的方法转换为 GET 或 POST，并由 submit 触发。同样，目标将是页面的 body，并使用 innerHTML 交换。然而，URL 不会被推送，也不会创建历史记录条目。（如果您希望推送 URL，可以使用 hx-push-url 属性。）

以下是一些提升后的链接示例：

<div hx-boost="true">
  <a href="/page1">Go To Page 1</a>
  <a href="/page2">Go To Page 2</a>
</div>

这些链接将向各自的 URL 发出 AJAX GET 请求，并用其替换 body 的内部内容。

以下是一个提升后的表单示例：

<form hx-boost="true" action="/example" method="post">
    <input name="email" type="email" placeholder="Enter email...">
    <button>Submit</button>
</form>

此表单将向给定的 URL 发出 AJAX POST 请求，并用其替换 body 的内部内容。

Notes