IE中按钮问题根源在于上下文环境：DOCTYPE必须顶格无BOM声明以防怪异模式；button需显式设inline-block及vertical-align兜底；onclick须用attachEvent绑定；disabled状态需class配合JS同步控制。
IE里按钮出问题，基本不是按钮本身的问题，而是它所处的上下文环境没处理好——button元素本身在IE6+都支持，但样式、事件、表单行为会因渲染模式、CSS解析、JS调用方式不同而失效。
DOCTYPE必须顶格写，否则
IE一旦进怪异模式（Quirks Mode），button的盒模型就按IE5规则算：padding和border不包含在width内，导致按钮宽度塌缩、文字溢出、点击热区偏移。Chrome DevTools Elements面板顶部显示“Quirks”就是铁证。
必须独占第一行，前面不能有空格、BOM、注释甚至UTF-8 BOM字节- VS Code右下角确认编码是“UTF-8 without BOM”，不是“UTF-8”
- 别用
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">这类过时声明，它在IE中反而更容易触发兼容视图
IE8–IE11中
IE8默认把button当inline元素处理，哪怕你写了display: block，它也可能被父容器的line-height或font-size意外拉高；IE9–11对vertical-align: middle的支持也不稳定，常导致按钮和文字基线错位。
- 显式设置
button { display: inline-block; *display: inline; *zoom: 1; }（*是IE7 hack，仅生效） - 统一
vertical-align: middle，并配line-height: normal防继承干扰 - 避免只靠
margin: auto居中，IE8不支持block级button的自动外边距居中，改用text-align: center包裹容器
onclick事件在IE6–IE8里不能直接绑定到
IE6–IE8中，button的onclick属性监听器可能被忽略，尤其当按钮在form里且含type="submit"时，点击后页面刷新但事件没触发——这不是bug，是IE对表单提交流程的特殊拦截逻辑。
立即学习“前端免费学习笔记（深入）”；
- 用
attachEvent替代addEventListener：btn.attachEvent('onclick', handler)（IE6–IE8专属） - 若用jQuery，确保版本≤1.12.4（jQuery 2+已放弃IE8支持）
- 避免在
button里嵌套div或span再绑事件，IE6–IE7会丢失冒泡路径，改用innerText或textContent安全取文本
IE中
IE默认禁用按钮是灰色+不可点击，但不会自动降级opacity或cursor，用户可能误点或看不出状态变化；更麻烦的是，IE8不响应:disabled伪类，纯CSS无法覆盖。
- 给禁用按钮加class：
<button class="btn disabled">提交</button>，再写.btn.disabled { opacity: 0.6; cursor: not-allowed; } - JS中同步操作
btn.disabled = true和btn.className += ' disabled'，避免状态不一致 - IE8不支持
pointer-events: none，别指望靠这个屏蔽点击，老老实实用disabled属性+class双保险
真正卡住人的从来不是button标签本身，而是它依赖的渲染模式、CSS继承链、事件绑定时机——这些环节只要有一处没对齐IE的实际能力边界，按钮就会“看起来在，点起来没反应”。
