HTML无原生undo/redo API，需开发者手动维护状态栈；document.execCommand已废弃不可靠；应监听input/keydown等事件按语义粒度存档，并谨慎拦截Ctrl+Z/Y。
HTML 中没有原生的 undo / redo API
浏览器不提供类似 Word 那样的全局撤销栈接口。所谓“HTML 撤销”，实际是开发者在特定场景下模拟的行为，比如 contenteditable 元素的编辑、表单输入、Canvas 绘图或 DOM 增删等。恢复操作（redo）必须由你手动维护状态快照或操作日志，不能依赖浏览器自动补全。
document.execCommand('undo') 已被废弃且不可靠
旧方案用 document.execCommand('undo') 或 'redo' 控制富文本编辑，但该 API 在 Chrome 90+、Firefox 80+ 中已被移除或禁用，调用会静默失败或抛出 TypeError: document.execCommand is not a function。即使在仍支持的环境里，它的行为也不一致：无法撤销 JS 触发的 DOM 修改，只响应用户直接输入/粘贴等原生编辑动作。
- 不要在新项目中使用
execCommand实现撤销恢复 - 已用该方案的旧系统，需逐步迁移到自管理状态栈
- 替代方案：监听
input、keydown（Ctrl+Z / Ctrl+Y）、beforeinput等事件，捕获变更并存档
实现可恢复的编辑状态，关键在「何时存档」和「存什么」
存档太频繁（如每次 keydown）浪费内存；太稀疏（如只在 blur 时存）会导致中间步骤丢失。推荐按语义操作粒度存档：
- 对
contenteditable：监听input事件，但用setTimeout防抖（如 300ms），避免连续输入存多份相同快照 - 对表单控件：监听
change（select/checkbox）或input（text/textarea），每次触发存当前value或整个表单FormData - 对 DOM 变更：封装增删改函数，每次调用后 push 到
undoStack数组，每个项包含反向操作函数（如{ type: 'remove', node: el, parent: el.parentNode, next: el.nextSibling }）
示例简化版存档逻辑：
let undoStack = []; let redoStack = [];<br>function saveState() {<br> undoStack.push(document.getElementById('editor').innerHTML);<br> redoStack = [];<br>}注意：直接存 innerHTML 会丢失事件绑定和部分属性，生产环境建议用 structuredClone（需检查兼容性）或序列化关键数据字段。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
立即学习“前端免费学习笔记（深入）”；
Ctrl+Z / Ctrl+Y 的拦截与接管必须谨慎
用户习惯按快捷键触发撤销恢复，但浏览器默认行为可能与你的逻辑冲突。例如在 contenteditable 中，原生 Ctrl+Z 会撤销光标位置变化或格式，而你的栈可能只记录内容变更。解决方式：
- 用
event.preventDefault()拦截keydown中的Ctrl+Z和Ctrl+Y，再手动触发你的undo()/redo() - 但别拦截所有组合键——比如
Ctrl+A、Ctrl+C必须保留，否则破坏基础可用性 - 在非编辑区域（如按钮点击触发的状态变更）也要支持快捷键，需全局监听并判断当前焦点是否在可编辑元素内
容易忽略的一点：移动端没有 Ctrl 键，需提供 UI 按钮，并考虑 Safari 对 beforeinput 的兼容性问题——它不触发该事件，得 fallback 到定时轮询 textContent 变化。
