htmx 速查
共 26 条 htmx 常用属性,涵盖基础、触发与参数、表单、进阶、事件与调试。 支持搜索与分类筛选,点击即可复制。
基础
用 HTML 属性发请求、换局部。
| 命令 | 说明 |
|---|---|
| 引入(单文件,无构建) | |
| GET 并把响应放进 #out | |
| 各方法 | |
| 替换方式 | |
| 目标元素 | |
| 工作方式 |
触发与参数
何时发、发什么。
| 命令 | 说明 |
|---|---|
| 触发事件 | |
| 防抖与多事件 | |
| 定时轮询 | |
| 附带参数 | |
| 筛选参数 |
表单
提交与校验。
| 命令 | 说明 |
|---|---|
| 表单提交 | |
| 自动序列化 | |
| 二次确认 | |
| 禁用 | |
| 加载指示 |
进阶
历史、增强与实时。
| 命令 | 说明 |
|---|---|
| 渐进增强整页 | |
| 保留可后退 | |
| 带外替换 | |
| SSE | |
| WebSocket |
事件与调试
监听生命周期。
| 命令 | 说明 |
|---|---|
| 监听请求完成 | |
| 常用事件 | |
| 全局配置 | |
| 响应头控制 | |
| 行为配置 |
使用说明
htmx 常用属性速查:基础、触发与参数、表单、进阶、事件与调试;支持搜索与分类筛选,点击即可复制。
- 按用途点分类:基础、触发与参数、表单、进阶、事件与调试。
- 点「属性」列复制,替换路径与目标选择器后使用。
- 服务端返回 HTML 片段即可,前端只声明 hx-* 属性。
- 用 hx-indicator 显示加载态、hx-confirm 做二次确认。
常见问题
- htmx 需要写 JS 吗?
- 基本不用:交互由 HTML 属性声明,请求与局部替换自动完成;只有复杂场景才写少量 JS 监听 htmx 事件。
- 和后端框架冲突吗?
- 不冲突。任意能返回 HTML 片段的后端(Django/Flask/Rails/PHP/Go…)都能配合,htmx 只负责发请求与替换 DOM。
- 如何做局部刷新?
- 用 hx-target 指定要更新的元素、hx-swap 指定替换方式;服务端只返回该片段,避免整页刷新。