应依据操作系统和浏览器实际版本而非硬件出厂年份选择HTML特性，因硬件年份与网页能力无直接关联；需通过navigator.userAgent、location.protocol和API存在性等运行时指标精准判断。
别按硬件出厂年份选HTML特性，得看操作系统和浏览器实际版本。 硬件年份和网页能力之间没有直接映射关系——一台2012年的笔记本装了Chrome 128，就比2020年出厂但只跑IE11的工控机支持更多HTML特性。
为什么出厂年份完全不可靠
硬件出厂时间不决定软件栈：Windows 7机器可能从未升级过IE，也可能被手动装上Edge；MacBook Pro 2015出厂带Safari 9，但用户可升级到Safari 17；很多嵌入式设备或POS终端即使新出厂，也固化着旧内核（如WebView2 1.0.1245.22）。查document.createElement('dialog').showModal是否可用，比查“这台戴尔是2016年产的”有用一百倍。
真正该查的三个运行时指标
打开开发者工具控制台，逐条执行：
-
navigator.userAgent—— 粗略判断浏览器类型和大版本，但可能被伪装 -
location.protocol === 'https:'——<dialog>、inert、popover等现代API在HTTP下被禁用，HTTPS是硬门槛 -
'showModal' in HTMLDialogElement.prototype—— 直接检测API是否存在，比查caniuse更准，且能捕获企业环境里被策略禁用的情况
老旧硬件常见陷阱与绕过方式
2012–2016年间的主流设备常卡在以下组合中，需针对性处理：
立即学习“前端免费学习笔记（深入）”；
- Windows 7 + IE11：不支持
fetch、Promise、classList，但支持addEventListener。必须用XMLHttpRequest+className字符串拼接，html5shiv仅对语义标签有效，对API无效 - macOS 10.11 + Safari 9：支持
flex但不支持gap，grid完全不可用；input[type="date"]渲染为文本框，无原生弹出日历 - Android 4.4 WebView：基于Chromium 30，不支持
async/await、Map、Set，但意外支持querySelectorAll——别假设“老内核=全都不行”
最易被忽略的是：同一台设备上，不同应用容器的HTML能力可能天差地别。Electron 13用Chromium 89，但某个国产办公套件内置的WebView可能还停留在Chromium 68。永远以if ('inert' in document.createElement('div'))这类运行时检测为最终依据，而不是硬件铭牌或采购单上的年份。
