HTML本身不支持动态适配多渠道发布，所谓“适配”本质是前端用data-*等属性做静态配置标记，再由JS主动读取并分支调用对应通道发送函数，而非HTML自动映射或响应式切换。
HTML 本身不支持“动态适配多渠道发布”，所谓“适配”本质是前端用属性做标记、JS 主动读取并触发对应通道逻辑，不是靠 HTML 自动映射或渲染切换。
data-* 属性只能存配置，不能自动触发推送
常见错误现象：el.dataset.pushChannel = "sms" 改了值，但没手动调用发送函数，推送仍走默认通道；在 Vue 模板里写 {{ item.data-topic }}，实际读不到——dataset 不进响应式系统。
-
data-push-channel、data-user-id等只是字符串容器，DOM 加载后就固定了，不会监听变化 - 必须在交互事件（如 click）中显式读取：
button.dataset.pushChannel，再 if/else 分支调用sendWebPush()或sendSms() - 若需运行时更新通道，得配合手动触发逻辑，比如：
if (newChannel) { sendByChannel(newChannel, userId); }
formaction + hidden 字段更适合服务端驱动的通道路由
当推送需按用户设备类型（iOS → APNs、Android → FCM、Web → VAPID）由后端统一分发时，纯前端判断不可靠，且难维护策略变更。
-
formaction必须指向真实后端端点，例如/api/push/apns，不能是占位符或前端路由 - 用
<input type="hidden" name="user_id" value="123">传上下文，避免敏感参数暴露在 URL 中 - 不要设
enctype="application/json"：浏览器原生表单只支持application/x-www-form-urlencoded或multipart/form-data - JS 失效时仍能降级提交，比全 JS 方案更健壮
HTMX 的 hx-post + hx-headers 是轻量协调多通道的实用组合
HTMX 不需要写 JS，靠属性声明就能封装不同通道的请求细节，适合运营页快速迭代，但前提是后端接口已按通道拆分好。
立即学习“前端免费学习笔记（深入）”；
-
hx-post="/api/push/webpush"对应 Web Push 接口，hx-post="/api/push/sms"对应短信网关 - 用
hx-headers='{"X-Channel": "webpush"}'传递通道标识，比拼 URL 路径更灵活 - 注意：HTMX 请求仍走 fetch/XHR，若需 Service Worker 拦截或离线重试，得额外配置
- 不适用于需复杂前置校验（如权限检查、频次限制）的场景，这些逻辑仍得在 JS 或服务端做
最常被忽略的是：所有“适配”都依赖运行时主动读取和分支处理，data- 属性不参与 DOM 更新响应，formaction 不会自动识别设备类型，HTMX 也不懂业务通道语义——它们只是把配置从 HTML 搬到 JS 或服务端的搬运工，搬完之后的事，还得你亲手写清楚。
