属性巡礼

htmx 的 API 就是一组 HTML 属性。记住「谁、何时、去哪、怎么做」四要素，全部 hx-* 各归其位。

动词属性：向服务器「说」什么

放在任何标签上，声明该元素将发起的 HTTP 方法：

hx-get

发起 GET 请求，通常用于查询与拉取片段

hx-post

发起 POST 请求，创建资源或提交数据

hx-put

发起 PUT 请求，整体更新资源

hx-patch

发起 PATCH 请求，局部更新资源

hx-delete

发起 DELETE 请求，删除资源（v4：不再自动携带所在表单）

hx-query

v4 新增动词——查询语义独立成词，与 GET 并存

hx-action

统一入口，值写「动词 url」，如 hx-action='post /clicked'

动词属性一例 · 行内删除

<tr>
  <td>《超文本》条目</td>
  <td><button hx-delete="/row/7" hx-confirm="确定删去这一行？"
              hx-target="closest tr" hx-swap="outerHTML">
    删除
  </button></td>
</tr>

目标与方式：响应换到哪里

hx-target

指定响应 HTML 的落点：CSS 选择器，或 closest、find、next、previous、after、before 轴相对元素，或特殊值 this、window、body

hx-swap

指定换入方式：innerHTML（默认）、outerHTML、beforebegin……详见「交换」章

hx-select

从响应整页 HTML 中只取某个 CSS 选择器命中的部分

hx-select-oob

在换入主目标之余，顺带换出响应里 hx-swap-oob 标记的旁路片段

动词属性缺省hx-target时，响应默认换入发起元素自身的内部。这是新手最常踩的第一课：想换别处，就明说。

何时触发

hx-trigger 解开「只有点击与提交」的限制——事件名、修饰符、轮询皆可用：

触发器三例

<div hx-get="/calendar?d=2026-08-31" hx-trigger="mouseenter">悬我</div>

<input hx-get="/search" hx-trigger="keyup changed delay:300ms" name="q"/>

<div hx-get="/inbox/count" hx-trigger="every 30s">收件箱</div>

完整语法（once、changed、from:、target:、consume、按键修饰……）在「触发」章细讲。

辅助属性

hx-boost:inherited

把普通 <a> 与 <form> 渐进增强为 htmx 请求——v4 继承须显式，在 <body> 写 hx-boost:inherited 才罩得住全站；本站导航即是

hx-push-url

换入片段的同时更新浏览器地址栏与历史栈

hx-indicator

请求进行中为指定元素加上 htmx-request 类——转圈动画的挂钩点

hx-confirm

发起前弹出服务器式确认框，值即文案

hx-pending

v4 乐观 UI：请求先换入临时内容，落定后再校正（旧名 hx-optimistic）

hx-status

v4 按响应状态码定制交换，如 hx-status:4xx='swap:none'

hx-headers

JSON 字面量，附加请求头；也接受 js: 前缀的动态求值写法

hx-vals

JSON 字面量，向提交数据里注入额外参数；v4 动态求值统一走 js: 前缀

hx-include

除最近表单外，还要一并采集哪些元素的值

hx-preserve

换页时保住某些元素不被替换（如播放器、输入焦点）

hx-config

元素级请求配置（超时等），v4 由旧 hx-request 更名，取 HCON 语法

hx-on::after:request

内联事件钩子，冒泡 htmx:* 事件（v4 事件名以冒号分层）；详见「请求」章

hx-ignore

v4 中令该元素及后代完全不被 htmx 处理——旧版「停止处理」的 hx-disable 更名而来

hx-disable

v4 新语义：请求进行期间禁用其他指定元素（防连点），不再表示关闭 htmx

v4 的继承改为显式：旧版祖先属性会被后代自动继承，v4 须在祖先属性上加 :inherited 后缀（如 hx-target:inherited）才生效；hx-disinherit 随之退役。嫌麻烦可用配置 {"implicitInheritance": true} 回退旧行为——但那是迁移桥，不是归宿。

速查总表

要素	属性	一句话
说啥	hx-get hx-post hx-put hx-patch hx-delete hx-query hx-action	选一个 HTTP 动词与路径
何时	hx-trigger	默认 click / submit / change，可任意改
去哪	hx-target	响应的落点，默认自身内部
咋换	hx-swap	换入方式与延迟、过渡、滚动修饰
带啥	hx-include hx-vals hx-headers	控制请求附带的表单值与头（v4 删了 hx-params）
体面	hx-indicator hx-confirm hx-boost:inherited hx-push-url hx-pending	加载态、确认、渐进增强、乐观 UI 与历史
逃生	hx-preserve hx-on hx-ignore hx-disable hx-status hx-config	保留、事件钩子、停处理、防连点、状态码定制

四要素之中，「咋换」学问最多——下一章交换专讲 hx-swap。