应按优先级用正则提取：1. Edg/(\d+.\d+) → Edge；2. Firefox/(\d+.\d+).?rv:(\d+.\d+) → 取rv后版本；3. Chrome/(\d+.\d+)(?!\DEdg/) → 排除Edge；4. Version/(\d+.\d+).*?Safari/ → Safari；均需parseFloat()转数字比较，且UA仅用于统计或提示，关键逻辑必须依赖功能检测兜底。
怎么用 navigator.userAgent 安全提取 IE/Edge/Firefox/Safari 版本
直接读 navigator.userAgent 字符串能拿到原始 UA，但不能简单用 includes('IE') 或 indexOf('Chrome') 判断——Chromium 系浏览器（Edge、Opera、360）UA 里都带 Chrome/；Firefox 的真实版本在 rv:126.0 而非 Firefox/126.0；iOS 17+ Safari 可能压根不出现 Safari/。
必须按优先级顺序正则匹配，避免被干扰字段截断：
- 先匹配
Edg\/(\d+\.\d+)→ Edge 专属，Edg/125.0不会被 Chrome 正则误抓 - 再匹配
Firefox\/(\d+\.\d+).*?rv:(\d+\.\d+)→ 优先取rv:后的数字 - 然后匹配
Chrome\/(\d+\.\d+)(?!\D*Edg\/)→ 排除后面紧跟Edg/的情况 - 最后匹配
Version\/(\d+\.\d+).*?Safari\/→Version/17.5在Safari/前，且排除 Chrome/Edge UA
匹配后记得用 parseFloat() 转成数字再比较，避免字符串比对出错（如 '10' > '9' 为 false）。
为什么不能只靠 UA 判断，而要用功能检测兜底
UA 可被用户、插件、WebView、企业策略任意伪造。比如某银行内网强制把所有 UA 改成 Mozilla/4.0 (compatible; MSIE 8.0; ...)，实际跑的是 Chromium 内核；又或者 iOS WebView 精简 UA 后，Safari 关键字完全消失。
立即学习“前端免费学习笔记（深入）”；
真正该信的是运行时能力：
- 检测 Flexbox 是否可用：
typeof CSS.supports === 'function' && CSS.supports('display', 'flex') - 检测
fetch是否可安全调用：typeof fetch === 'function' && typeof Request === 'function'，再加try/catch实际发个空请求 - 检测
localStorage是否真能写：try { localStorage.setItem('test', 'ok'); localStorage.removeItem('test'); } catch(e) { /* 降级 */ }
UA 只适合埋点统计或弹提示框，关键逻辑必须走功能检测。
IE 条件注释已失效，现在怎么给 IE8–IE9 加 html5shiv
IE10+ 已废弃条件注释语法（<!--[if lt IE 9]>...<![endif]-->），但在 IE8–IE9 中仍有效——前提是文档模式没被强制设为 Edge（比如用了 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 会直接跳过条件注释）。
实操要点：
-
<!DOCTYPE html>必须是文件第一行，前面**不能有 BOM、空格、PHP 输出、注释** -
html5shiv的<script>必须放在所有<link rel="stylesheet">之前，否则 IE 下样式无法作用到语义标签上 - CDN 不稳定时，建议把
html5shiv.min.js内联进<head>，避免加载失败导致<header>等标签不被识别 - 仅引入脚本不够，还得补 CSS：
header, nav, section, article, aside, footer { display: block; }
验证是否生效：打开 IE9 DevTools → Elements 面板确认 <main> 标签存在；或在 Console 执行 document.querySelectorAll('main').length，返回大于 0 才算成功。
Vue 项目中在 index.html 里做 IE 低版本拦截提示的注意事项
很多 Vue 项目把 IE 检测逻辑直接塞进 public/index.html 的 <script> 里，但容易踩两个坑：
- 脚本执行时机太早：如果放在
<head>顶部，navigator对象可能还没初始化（极少见但存在）；建议包一层window.onload或用document.write确保同步输出 - IE11 也被误拦：旧代码常写
/msie\s\d+/i，但 IE11 UA 已不含MSIE，改用Trident\/\d+或rv:\d+更稳 - 提示内容别用现代 CSS：弹层若用
position: fixed+flex，在 IE8–IE9 里会彻底乱掉；老老实实用position: absolute+text-align: center+ 行内 style
最关键的一点：这个提示只是“友好劝退”，不能替代 JS 降级。哪怕弹了提示，后续 Vue bundle 仍需用 browserslist 配置 ie >= 11 并引入 core-js/stable，否则白屏风险极高。
