一眼看出页面用HTML4还是HTML5，看DOCTYPE：HTML4的DOCTYPE冗长带URL，HTML5仅为<!DOCTYPE html>，无版本号、URL和SYSTEM声明。
怎么一眼看出页面用的是 HTML4 还是 HTML5
看 <!DOCTYPE html> —— 这是最直接、最可靠的判断依据。HTML4 的 DOCTYPE 又长又带 URL，比如 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">；而 HTML5 只有短短七个字符，不区分大小写，且**没有版本号、没有 URL、没有 SYSTEM 声明**。
注意：仅靠 document.doctype.name 判断不可靠——IE8 下可能返回 "html"，但实际根本不认识 <header>；Chrome 某些旧版本也可能伪造 DOCTYPE。所以 DOCTYPE 是起点，不是终点。
- 打开浏览器开发者工具 → “Elements” 面板 → 查看第一行
- 不要信
navigator.userAgent，它可被篡改，也和 HTML 版本无关 - 如果 DOCTYPE 是 HTML5，但页面大量用
<div class="header">，那只是“用了 HTML5 声明”，不代表语义化落地
语义标签在 IE8 里不显示？不是 CSS 问题，是根本没被识别
<header>、<nav>、<article> 这些标签在 IE8 及更早版本中不是“隐藏了”，而是被当成未知内联元素处理：无法设置 display: block，CSS 选不到，document.querySelector('header') 返回 null，连 document.createElement('header').nodeType 都是 1（说明 DOM 创建成功），但渲染树里压根没这玩意儿。
- 必须引入
html5shiv，且放在<meta charset="utf-8">之后、任何 CSS 或 JS 之前 - CDN 地址推荐：
https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js（注意：只对 IE9 及以下生效，IE10+ 原生支持） - 别用
document.write动态注入 html5shiv——IE8 在 document.readyState === 'loading' 时会阻塞解析，导致白屏
localStorage 在 Safari 隐私模式下报错？存在性检测不等于可用性检测
typeof localStorage !== 'undefined' 在 Safari 隐私模式下仍为 true，但调用 localStorage.setItem() 会立刻抛出 QuotaExceededError。这不是 bug，是 Safari 主动限制第三方存储的策略。
立即学习“前端免费学习笔记（深入）”；
真正靠谱的做法是：**尝试写一次再删掉**，而不是只查类型或属性是否存在。
function isLocalStorageAvailable() {
try {
const testKey = '__storage_test__';
localStorage.setItem(testKey, '');
localStorage.removeItem(testKey);
return true;
} catch (e) {
return false;
}
}
- 同理适用于
sessionStorage、indexedDB（需用indexedDB.open()+ error 事件判断） - 不要在初始化阶段就无条件调用
localStorage.getItem()，容易因异常中断后续逻辑 - 移动端 WebView（如旧版安卓系统）可能声称支持
Promise，但Promise.resolve().then()不触发回调——得实测行为，不能只查typeof Promise
video/audio 标签兼容性差？不是写法问题，是编码格式和浏览器解码器决定的
HTML5 原生 <video> 标签本身兼容性很好（IE9+、Chrome 4+、Firefox 3.6+ 都支持），但“播不出”绝大多数是因为视频文件编码格式不被目标浏览器支持，而非标签语法错误。
例如：Safari 不支持 VP9 编码的 WebM，iOS Safari 不支持 MKV 容器；老版 Android WebView 对 H.264 的 Baseline Profile 支持稳定，但 High Profile 就容易卡顿或黑屏。
- 生产环境务必提供至少两种格式：
<source src="video.mp4" type="video/mp4">+<source src="video.webm" type="video/webm"> - 用
canPlayType()检测支持度：video.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"')返回"probably"才算较可靠 - 别依赖
autoplay属性——现代浏览器普遍禁止无用户交互的自动播放（尤其含声音），要用muted+autoplay组合才有可能成功
