旧版浏览器黑屏白屏主因是html未被识别为text/html或解析失败：先查content-type是否为text/html，再验doctype是否标准且无bom，接着用w3c验证标签闭合，然后确保script不混用src与内联js，最后禁用es6+语法及现代css布局。
旧版浏览器（尤其是 IE8–10、早期 Android Browser）打开 HTML 页面时直接黑屏或白屏，不是 JS 报错导致的“内容消失”，而是整个文档树压根没建起来——根本原因通常是 HTML 解析失败或渲染引擎拒绝执行现代语法。修复必须从最底层入手，不能靠 polyfill 或 JS 补救。
HTML 文件未被识别为 text/html
本地双击打开 index.html 或用老旧服务器（如 IIS 6、Apache 2.2 默认配置）托管时，响应头缺失 Content-Type: text/html，IE 会把它当作文本文件直接下载或空白显示。
- 检查方式：F12 → Network → 刷新 → 点开
index.html请求 → 查看 Headers → 找Content-Type字段是否为text/html - 本地测试时，别用 file:// 协议双击打开；改用轻量 HTTP 服务，比如 Python 2 的
python -m SimpleHTTPServer 8000（自动设对 MIME） - 若用 Express，务必加
res.set('Content-Type', 'text/html')；Nginx 需确认types { text/html html; }已启用
DOCTYPE 和标签闭合错误触发怪异模式
IE8 及更早版本对 DOCTYPE 极其敏感，一行写错就强制进入 Quirks Mode，后续所有 CSS/JS 解析全乱套，表现就是整页黑/白/错位。
- 必须用标准声明：
（注意无空格、无注释、无 BOM 头） - 禁用自闭合标签写法：
<img src="a.jpg">可以，但<img src="a.jpg">在 IE8 会解析中断 -
<script></script>标签内禁止混写内联 JS 和src属性：<script src="a.js">console.log(1)</script>是非法的，IE 直接报错并停在那 - 用 W3C Validator 验证源码，重点看
Unclosed element和Stray end tag类错误
脚本阻塞且无 fallback 导致白屏
旧浏览器不支持 async、defer，也不识别 type="module"，把现代 JS 放在 里，一旦报错（比如用了 const 或箭头函数），后面 DOM 就不渲染了。
- 首屏 JS 必须用传统写法：
var声明、function定义、无 ES6+ 语法 - 避免在
中直接执行逻辑；改成底部加载，并用document.write或document.getElementById插入内容 - 检测
window.console是否存在再调用：if (window.console && console.log) console.log('ok');，否则 IE8 直接崩 - 关键 DOM 操作前加存在性判断：
if (document.getElementById('main')) { ... }，防止元素未加载完就操作
CSS 渲染链断裂引发视觉空白
不是页面没内容，而是样式让内容“不可见”：比如 display: none、visibility: hidden、opacity: 0 被旧引擎误读，或 flex/grid 布局直接失效导致元素堆叠到可视区外。
- 禁用
flex、grid、vh/vw单位；改用float+width+clear布局 - 所有颜色值用十六进制或
rgb()，禁用hsl()、lab()、display-p3()等新函数 - 避免
transform、will-change、filter—— IE9 仅支持-ms-transform，且滤镜链会切断渲染 - 图片必须带
alt属性，且优先用<img src="">而非background-image，后者在 IE7–8 中不触发重绘
真正麻烦的不是语法降级，而是旧浏览器对“空白”的定义和现代完全不同：它可能把一个未闭合的 <div> 后所有内容都吞掉，也可能把 <code>console.log 当成致命错误直接 halt。测试不能只靠 DevTools 模拟，得真机跑 IE11 兼容模式或 VirtualBox 里的 Windows 7 + IE8 环境——模拟器永远看不出真实渲染管线在哪断的。
