光标跳到开头是因focus()仅获焦点而未控制插入点，需用range+selection手动定位；contenteditable切换后光标消失主因是dom结构污染，应清理冗余标签；固定末尾需先selectnodecontents再collapse(false)，并确保有可折叠文本节点。
光标跳到开头？focus() 不等于定位光标
直接调用 el.focus() 只是让元素获得焦点，浏览器会按默认策略决定光标落点：可能是首个文本节点起始、空 <p></p> 后崩溃、或复用上次 selection 缓存——结果完全不可控。双击启用 contenteditable="true" 后光标总回开头，本质是混淆了“焦点”和“插入点”两个概念。
必须在 DOM 渲染完成、contenteditable 生效后，手动构造 Range 并注入 Selection：
- 确保可交互：加
setTimeout(() => { ... }, 0)或监听transitionend，避免操作未渲染节点 - 获取点击位置：对双击事件，用
event.clientX/Y配合document.caretPositionFromPoint()（Chrome/Firefox）或document.caretRangeFromPoint()（旧 Safari）拿到node和offset - 设置并应用：用
range.setStart(node, offset)锚定，再sel.removeAllRanges(); sel.addRange(range)——漏掉removeAllRanges在 Safari 下极易失效
切换 contenteditable 状态后光标消失？DOM 结构污染是主因
contenteditable="false" 切换为 true 后光标“消失”，往往不是 JS 没执行，而是 DOM 已被污染：空行、零宽字符、嵌套 <div> 或 <code><p></p> 导致 Range 无法合法 collapse()。
实操建议优先清理结构，而非强行重置：
- 切换前执行
el.innerHTML = el.textContent || ''，保留纯文本语义，清掉所有冗余标签和属性 - 避免用
innerHTML = ' '占位——它生成不可编辑的文本节点，干扰后续Range定位 - 若需保留格式，用
textContent提取内容，再用insertAdjacentHTML('beforeend', cleanHtml)重建干净结构 - 禁用状态时务必加
user-select: none和[contenteditable="false"]::selection { background: transparent }，防止双击前意外触发 selection
想把光标固定在末尾？collapse(false) 不是万能钥匙
range.collapse(false) 是必要步骤，但不是充分条件。如果目标元素内没有可折叠的文本节点（比如全是空格、<img> 或空 <span></span>），该操作会静默失败或抛错。
安全写法分两步走：
- 先
range.selectNodeContents(el)选中全部内容，再range.collapse(false)折叠到末尾 - 但若
el内容为空，selectNodeContents返回空Range，需 fallback：插入一个（零宽空格），再操作 - 最后必须显式执行
sel.removeAllRanges()，再sel.addRange(range)，否则 Safari 和部分旧版 Chrome 会忽略新位置
为什么 MutationObserver + selectionchange 才是协同编辑的起点
contenteditable="true" 本身不参与协同，只负责本地光标和输入行为。所有变更锁在本地 DOM，不会自动序列化、广播或做冲突检测。指望 input 事件捕获全部操作是错的——它漏掉加粗、缩进、拖拽图片、中文输入法上屏、甚至右键粘贴富文本。
真正可用的协同基础是：
- 用
MutationObserver监听characterData和childList，粒度细、兼容好 - 配合
selectionchange监听光标/选区变化，否则无法定位操作发生的位置 - 禁用默认粘贴：
onpaste="event.preventDefault()"，再从event.clipboardData.getData('text/plain')拿干净文本 - 拦截回车：
keydown中对Enter调e.preventDefault()，否则 Chrome 插<div></div>、Firefox 插<br>，格式彻底失控
DOM 快照同步（比如定时取 innerHTML 发给服务端）在协同中必然崩溃：两人同时在开头插入文字，快照比对无法识别并发插入，结果必丢内容。这不是性能问题，是模型缺陷——协同必须基于操作日志（oplog）或 CRDT，而不是状态快照。
