document.designmode = "on"可开启全页面dom即时编辑模式，支持文本修改但非所见即所得；需手动执行"off"关闭，不自动还原innerhtml更改，框架区域内容易被覆盖。
直接执行 document.designMode = "on" 就能开启全页面原始 DOM 结构的即时编辑模式，但要注意它不是“所见即所得”的安全编辑方式，而是一种底层富文本编辑状态，会覆盖默认交互行为。
开启方法：一行命令立即生效
在已加载完成的网页中，打开浏览器开发者工具（F12），切换到控制台（Console）标签页，输入并回车：
document.designMode = "on";
页面立刻进入可编辑状态：所有文本可选、光标可定位、内容可直接修改。此时 HTML 元素（如 <div>、<code><p></p>）表现得像 Word 文档段落，支持粘贴、删除、拖拽文字等操作。
关闭与恢复必须手动执行
关闭不能靠刷新或后退，必须再运行：
document.designMode = "off";
这会退出编辑模式，DOM 结构本身不会被破坏，但以下情况不会自动还原：
- 被用户手动改写的 innerHTML 不会被撤回
- 原页面绑定的 click/input 等事件监听器仍存在，但可能因编辑过程触发重绘而失效
- 使用 React、Vue 等框架渲染的区域，下次状态更新时编辑内容大概率被覆盖
Firefox 用户可预设永久启用（仅限本地调试）
在 Firefox 地址栏输入 about:config → 接受风险 → 搜索 dom.document.editing.host.enabled → 右键新建布尔值并设为 true。该设置让 designMode 在任意页面都可用（仍需手动执行 "on" 启用）。
iframe 内容需单独启用
主页面设 designMode = "on" 不会影响内嵌 iframe。若需编辑 iframe 内容，且其为同源，需额外操作：
const iframe = document.querySelector('iframe');if (iframe.contentDocument) iframe.contentDocument.designMode = 'on';
跨域 iframe 无法访问 contentDocument，会抛出 DOMException 错误。
不复杂但容易忽略：它改的是渲染层行为，不是 DOM 编辑器；真正要持久化修改，还得配合开发者工具的 Elements 面板或 source 级调试手段。
