Chrome execCommand('insertHTML') 行为

Question

在开发某种带有不可编辑块的所见即所得编辑器时，我在 Chrome（以及 Safari）中发现了有趣的行为：当您在 div 中使用 contenteditable="true"（或其他元素）创建 execCommand('insertHTML') 时) - 工作正常，如您所料。但是如果你尝试在没有“contenteditable”的嵌套div中执行它 - 浏览器删除所有属性，但根据css添加style。

jsfiddle: http://jsfiddle.net/DXz9e/2/

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

<span id="newInsertedNode" class="constructor-input-field" data-id="23">Some text</span>

在内部：

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

我只想说：“这到底是怎么回事？” 它在FF中也可以正常工作

Answer 1

一种解决方案是不使用 Span 元素（参见此处：https://dev.ckeditor.com/ticket/9004）。