使用JavaScript Rangy在Chrome中的空节点之前插入节点

Question

当我在另一个元素的开头处（空|插入位置）尝试在空元素之前插入节点时，我注意到了这个问题。从这开始：

<p>|<span />Some text</p>

我在Rangy范围内使用了range.insertNode（）来粘贴一些文字，但在Chrome中我看到了这个结果，其中新节点出现在空<span>之后：

<p><span />|INSERTED TEXTSome text</p>

而不是：

<p>|INSERTED TEXT<span />Some text</p>

请注意，这似乎在IE9中可以正常工作，如果插入没有在<p>节点的开头完成，它也适用于Chrome，例如：

<p>Some |<span />text</p>

结果：

<p>Some |INSERTED TEXT<span />text</p>

这是一个简化的例子，但显示了我所看到的问题。

澄清（如果我接近这个错误的方式，有人可以提出替代方案）我试图插入文本，并且一旦插入完成，总是让光标出现在新插入文本的末尾。

E.g。 <p>|Original Text</p>应该成为<p>INSERTED TEXT|Original Text</p>

但是，插入一个节点会导致插入符号紧接在插入的文本之前（正如文档中说明它应该用于插入节点，因此没有任何投诉）。我试图在插入后使用空<span>作为标记来恢复插入位置（事实上我正在使用Rangy的选择保存和恢复模块为我做这个）。

Answer 1

这是因为WebKit不认为<span>之前的位置是有效的插入位置。它与这些Webkit错误有关：

• https://bugs.webkit.org/show_bug.cgi?id=23189
• https://bugs.webkit.org/show_bug.cgi?id=15256

如果范围符合您的预期，Rangy将允许您在所需的位置插入节点，但如果您从选择中获得范围，则范围将反映浏览器的选择概念。可能有一种解决方法，但我不太清楚你正在尝试做什么。