HTML无原生undo/redo机制，需手动用栈存操作指令或DOM快照；contenteditable的execCommand已废弃，浏览器快捷键响应不一致，须自定义keydown监听并阻止默认行为。
HTML 本身不提供撤销（undo）和恢复（redo）能力
浏览器原生的 document.execCommand 曾支持部分富文本编辑的撤销，但它已被废弃，且仅限于 contenteditable 元素在特定模式下生效。纯 HTML 结构（比如动态插入 <div>、修改 innerHTML）没有任何内置 undo/redo 机制——你删了一个 <p>，浏览器不会自动记住它。
实现撤销恢复必须自己管理状态快照
真实项目中要支持 undo/redo，核心是「在每次可逆操作前保存当前状态」。常见做法：
- 用数组栈（
undoStack和redoStack）存 JSON 序列化的 DOM 快照或操作指令（如{ type: 'delete', nodeId: 'p-123' }） - 避免直接存整个
document.body.innerHTML——体积大、diff 困难、丢失事件绑定和 input 光标位置 - 更轻量的做法是记录「操作意图」：比如用户点击了删除按钮，就 push 一条
{ action: 'remove', target: element, parent: element.parentNode, index: Array.from(parent.children).indexOf(element) } - 执行
undo时不是重新渲染 HTML 字符串，而是调用parent.insertBefore(target, parent.children[index])这类精确 DOM 操作
使用 contenteditable 时要注意浏览器行为不一致
即使启用 contenteditable="true"，不同浏览器对 Ctrl+Z 的响应范围也不同：
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- Chrome 和 Edge 通常只对输入、粘贴、格式化（加粗/列表）等内置命令触发 undo；手动 JS 修改
innerText不会进入其 undo 栈 - Firefox 对
execCommand的兼容性更差，且已完全移除对该 API 的支持 - 调用
document.execCommand('undo')在现代页面中大概率静默失败，控制台可能报TypeError: document.execCommand is not a function - 若真要接管快捷键，必须监听
keydown事件捕获Ctrl+Z/Ctrl+Y，然后走自己的栈逻辑，同时event.preventDefault()阻止浏览器默认行为
第三方库（如 immutability-helper 或 immer）解决的是状态管理，不是 DOM 撤销
这些库帮你安全地生成新 state，但它们不跟踪「如何还原」——你仍需自己设计操作描述结构、定义 apply 和 revert 函数，并维护栈。一个容易被忽略的细节是：DOM 节点引用不能跨快照复用，undo 时如果直接把旧节点 appendChild 回去，它可能已脱离文档或绑定了过期事件监听器。
立即学习“前端免费学习笔记（深入）”；
