Javascript Chrome execCommand（'；insertHTML'；）行为

在开发带有不可编辑块的所见即所得编辑器时，我发现Chrome（还有Safari）中的有趣行为：当您在

div

中使用

contenteditable=“true”

（或其他元素）生成execCommand（'insertHTML'）时，工作正常，正如您所期望的那样。但如果您尝试在嵌套的

div

中执行它，而不使用“

contenteditable

”-浏览器将删除所有属性，但根据css添加

样式

jsfiddle：

尝试插入内部和外部文本。看看html代码。我在外部看到（内容可编辑）：

一些文本

在内部：

<span style="background-color: red; color: blue;">Some text</span>

一些文本

我只想说：“到底发生了什么事？”
此外，它在FF中也可以正常工作。一种解决方案是不使用Span元素（请参见此处：）

<span style="background-color: red; color: blue;">Some text</span>