Javascript contentEditable div动态替换innerHTML

有没有一种方法（除了Rangy库）可以像在keyup上那样动态更改contentEditable Div InnerHTML，而不丢失光标位置/焦点？我希望使用纯javascript代码，尽可能简单

例如：

<div id="divId" contentEditable="true" onkeyup="change(this)"></div>

---

谢谢。

这不使用keyup事件，但也许它就足够了？请注意，应用于主体，您显然可以只针对某个元素

document.body.contentEditable='true';
document.designMode='on';
void 0;

---

如果要替换HTML，则需要一些保存和恢复选择的方法。这些选择包括：

在HTML替换之前，在选择的开始和结束处插入ID为的元素，然后按ID检索它们，并使用这些元素移动选择边界。这是最稳健的方法，也是Rangy所做的

在HTML替换之前，为选择的开始和结束存储某种基于字符的偏移量，然后重新创建选择。这在一般情况下有各种各样的问题，但根据您的需要，可能已经足够好了。我一直依赖于Rangy，但是如果你不介意失去对IE<9的支持，你可以很容易地去掉Rangy的东西

按像素坐标存储和恢复选择边界。浏览器对此的支持不好，如果HTML替换更改了布局，则不适用

---

谢谢，但这不是我需要的）我已经更新了我的问题，也许现在你会更好地理解

document.body.contentEditable='true';
document.designMode='on';
void 0;