旧版IE（IE6–IE8）不识别HTML5语义标签，需在<head>顶部用document.createElement()提前声明，并配合CSS设display:block；推荐用html5shiv或手写三行脚本，同时降级CSS选择器和JS API。
旧版浏览器（尤其是 IE6–IE8）根本不会把 <header>、<nav>、<main> 这类标签当 HTML 元素处理——DOM 里没有节点，CSS 选不到，JS 查不到。想让它们“被看见”，核心就一条：在浏览器开始解析页面前，用 document.createElement() 主动声明这些标签名。
必须在 <head> 最顶部执行脚本
IE 的 DOM 解析器遇到不认识的标签会直接跳过，不创建节点。所以声明动作必须发生在它读取 <body> 之前。一旦页面结构已渲染，再补调用也无效。
- 脚本要放在
<head>内第一个<script>标签中 - 不能等
DOMContentLoaded或window.onload - 推荐写法：
['header','nav','article','section','aside','footer','main','figure','figcaption','time'].forEach(tag => document.createElement(tag));
声明之后必须重置 display 样式
即使标签被识别，IE8 仍默认将其当作 inline 元素，导致布局塌陷。光有 JS 声明不够，必须配合 CSS 强制设为块级。
- 在所有样式表加载前，内联或提前引入这段规则：
header, nav, article, section, aside, footer, main, figure, figcaption, time { display: block; } - 避免只写
header { }，建议加 class 回退，例如.header, header { }，方便后续维护
用 html5shiv 还是手写？看场景选
html5shiv 是成熟方案，内部做了 createElement + 注入 display 样式 + 触发重绘，CDN 地址推荐：https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js。但企业内网或对稳定性要求高时，手写更可控。
立即学习“前端免费学习笔记（深入）”；
- 手写三行足够：
if (!document.createElement('header').nodeName) { ['header','nav','main'].forEach(tag => document.createElement(tag)); } - 搭配内联
<style>设置 display，并用条件注释包裹：<!--[if lt IE 9]><script>...</script><style>...</style><![endif]--> - 漏掉
<main>很常见——IE11 以下也不支持，务必包含
注意配套问题：CSS 和 JS 不能只依赖标签名
标签能显示不等于功能完整。旧浏览器对现代语法支持有限，需同步降级。
- CSS 选择器别只靠
nav a，可加 class 如.nav-link保证命中 - JS 查询别用
document.querySelector('header')（IE7 不支持），改用document.getElementById('header')或getElementsByClassName - 避免依赖
flexbox、data-*属性（需用getAttribute）、localStorage（IE7 及以下需回退到userData或 cookie）
