HTML5 中 语法无效，浏览器直接忽略或进入怪异模式；其与 DOCTYPE 冲突，DOM 中不生成节点， 已被 取代，推荐用 CSS Grid 和服务端包含或 SPA 路由重构布局复用逻辑。
HTML5 中 <frameset></frameset> 不是“不推荐”，而是语法无效——浏览器解析时直接忽略，或强制进入怪异模式（quirks mode）。
为什么 <frameset></frameset> 会触发解析失败
现代浏览器的 HTML 解析器在遇到 <frameset></frameset> 时，会判定文档类型与 DOCTYPE 不匹配。哪怕你写了 ，只要出现 <code><frameset></frameset>，HTML5 解析规则就中断，回退到类似 IE5 的旧引擎逻辑。这不是警告，是硬性拒绝。
- DOM 中根本不会生成
<frameset></frameset>节点，document.querySelector('frameset')永远返回null - 控制台通常不报错，但 Network 面板里可能看到子 frame 请求被静默取消
- 若混用
和<frameset></frameset>，内容会被丢弃，只渲染 frameset 区域（如果还能渲染的话）
<iframe></iframe> 和 <frame> 的本质区别
<frame> 是 frameset 的子元素，必须嵌套在 <frameset></frameset> 内；而 <iframe></iframe> 是独立的流式内容容器，可放在任意合法 HTML 上下文中。
-
<frame src="menu.html">：无语义、不可聚焦、无法被屏幕阅读器识别为导航区域 -
<iframe src="menu.html" title="主菜单" aria-hidden="false"></iframe>：显式声明用途，支持键盘导航和语义暴露 -
<frame>共享父页面的 JavaScript 执行上下文（容易污染）；<iframe></iframe>默认隔离，需主动用postMessage()通信
CSS Grid 替代 <frameset cols="20%,80%"></frameset> 的关键细节
用 grid-template-columns: 20% 80% 看似等价，但行为完全不同：百分比基于容器宽度，而旧 frameset 的列宽是强制固定比例、无视内容挤压。
立即学习“前端免费学习笔记（深入）”；
- 必须设
height: 100vh或明确高度，否则1fr无计算基准，整行会塌缩 - 推荐用
minmax(250px, 20%)替代纯百分比，兼顾最小可用宽度与响应式弹性 - 局部滚动要加
overflow-y: auto到具体区域容器（如.sidebar），不是给<iframe></iframe>加——后者只控制 iframe 自身视口，不代理内部文档滚动
服务端 include 与前端 SPA 路由哪个更接近原 frameset 语义
两者都不是“模拟 frameset”，而是重构交互契约：<frameset></frameset> 的核心其实是“布局复用 + 内容解耦”。服务端 include 在构建时合并，SPA 路由在运行时切换，但都避免了多文档上下文带来的状态割裂问题。
- PHP 的
include 'header.php';或 Nunjucks 的{% include 'nav.html' %}：适合内容静态、SEO 敏感场景，URL 变化即整页刷新 - React Router 的
<outlet></outlet>或 Vue Router 的<router-view></router-view>：适合交互密集型应用，导航不刷新页面，但需手动管理 document.title、scroll behavior 等 - 共同底线：不再让“导航”和“内容”属于不同
window对象，也就绕开了parent.frames[0].location这类脆弱引用
真正难迁移的不是布局代码，而是那些隐式依赖跨 frame 全局变量、window.name 传参、或靠 target="main" 触发跳转的逻辑——这些在新架构里没有对应物，必须重写。
