htmx：直接用 HTML 属性构建动态网页
一分钟看懂
htmx 是一个体积很小、无运行时依赖的前端库。它把 AJAX、CSS 过渡、WebSocket 和 Server-Sent Events 暴露为 HTML 属性，让链接、按钮、表单乃至其他元素都能发起请求，并把服务端返回的 HTML 片段替换到页面指定位置。
它代表一种“服务端驱动界面”的思路：后端继续渲染 HTML，浏览器只负责声明何时请求、把结果放在哪里。对于表单、管理后台和内容型应用，开发者可以获得局部刷新体验，而不必先搭建大型 SPA 状态体系。
你可以用它做什么
给传统服务端页面增加局部刷新
在按钮上添加 hx-post，在列表或容器上指定替换目标，就能提交操作并只更新局部内容。搜索、分页、筛选、无限滚动和行内编辑都可以沿用普通 HTTP 路由。
使用更多事件和 HTTP 方法
请求不再局限于链接 GET 和表单 POST。页面可在点击、输入变化、滚动或自定义事件时发送 GET、POST、PUT、PATCH、DELETE，并用交换策略控制替换、追加或删除内容。
接收服务器主动更新
通过扩展可使用 SSE 或 WebSocket，把通知、进度和实时状态推到页面。简单实时界面因此不必改造成完整前端框架应用。
主要能力
- 用
hx-*HTML 属性声明请求、触发器、目标和替换方式。 - 支持局部 HTML 更新、历史记录、加载状态和 CSS 过渡。
- 可扩展 WebSocket、SSE 和其他行为。
- 压缩后体积较小，不依赖其他前端库。
- 与任意能返回 HTML 的服务端语言或框架配合。
适合哪些人
它适合偏服务端渲染的团队、内部系统、表单和内容应用。高度离线、复杂本地状态、画布编辑器或重度客户端计算产品，React、Vue 等状态化框架可能更合适。
怎么开始使用
可直接引入官方发布脚本，或安装名为 htmx.org 的 npm 包；不要误装旧的 htmx 包。先在一个按钮或分页上尝试，让后端返回完整且合法的 HTML 片段，再逐步加入错误状态、加载提示和浏览器历史。
使用前需要知道
服务端返回 HTML 不会自动解决安全问题。所有写操作仍需 CSRF 防护、权限验证和输入校验；用户内容必须正确转义，不能把不可信字符串直接拼成标记。页面片段与完整页面的路由、缓存和测试策略也要保持一致。
htmx 会降低前端 JavaScript 数量，但交互复杂度仍然存在。如果大量元素互相依赖且状态难以追踪，应及时抽象组件或重新评估架构，不要把所有行为堆进属性。