不支持html渲染，仅能显示纯文本；替代方案是用模拟按钮并自由嵌入html，或让后端返回结构化json由前端组合渲染。
直接往 <button></button> 里写 HTML 字符串是行不通的——浏览器会把标签当纯文本显示，比如 <strong>点我</strong> 就真的只显示这串字符，不会加粗。
button.innerHTML 会失效，因为 button 不支持子元素渲染
即使你用 button.innerHTML = '<span>提交</span>'，大多数浏览器也会自动剥离所有 HTML 标签，只保留文本内容。这是 HTML 规范限制： <button></button> 的内容模型是 phrasing content，但实际渲染时，浏览器对内联 HTML 的处理极其保守，尤其在表单控件中。
- Chrome / Firefox / Safari 都会忽略
innerHTML设置的标签，只取文本节点 - 哪怕你用
insertAdjacentHTML或appendChild往 button 里塞<span></span>，部分浏览器（如旧版 Edge）可能报错或静默丢弃 - 想靠 CSS 控制文字样式（如颜色、字体粗细）可以，但无法嵌入图标、图片、链接等复杂结构
替代方案：用 div 或 span 模拟按钮行为
真正能自由渲染 HTML 的容器是 <div> 或 <code><span></span>，再通过 ARIA 和事件模拟按钮语义与交互：
- 加
role="button"和tabindex="0"让键盘可聚焦、可回车触发 - 监听
click和keydown（捕获Enter/Space） - 用 CSS 设置
cursor: pointer和:hover/:active状态 - 示例：
<div role="button" tabindex="0" onclick="handleClick()">点击<strong>立即生效</strong> </div>
如果必须用原生 button，只能做纯文本动态更新
后端返回的是带格式的 HTML 字符串（比如 <i>加载中...</i>），但 button 只认文本——那就得先提取纯文本：
- 用
DOMParser解析字符串，取doc.body.textContent，丢掉所有标签 - 或用正则粗略清洗：
htmlString.replace(/]*>/g, '')（仅限简单场景，不推荐处理用户输入） - 然后赋值给
button.textContent，不是innerHTML - 注意：这样会丢失所有样式和结构，
<em>重要</em>变成 “重要”，没了斜体
更安全的做法：后端返回结构化数据，前端组合渲染
比起让后端吐 HTML 字符串，更好的协作方式是让它返回 JSON，比如：
{ "text": "确认", "icon": "check", "disabled": false }
前端根据字段决定是否加图标（用 iconfont 或 SVG）、是否禁用、是否加 loading 动画。这样既规避了 XSS 风险，又绕开了 button 的 HTML 渲染限制，还能统一控制主题和状态。
真正麻烦的从来不是怎么塞进 button，而是为什么非得让 button 承担富文本渲染职责——它本就不是干这个的。
