瘦长操作DOM

Question

我有一组范围，从tokensToRanges函数创建：

Convert tokens into selection ranges

现在我想遍历每个范围，并应用行为给他们。不过，我得到一个错误：

Uncaught Error: Range error: Range is no longer valid after DOM mutation ([WrappedRange("foobar":6)])

现在我明白了为什么我收到的错误，但我不知道我怎么能遍历一组范围，并操纵每一个？

Answer 1

这是一个棘手的问题，我已经跑了几次。您的选项基本上是：

1. 将范围列表转换为范围边界列表。对于每对边界，创建一个范围，执行DOM操作并调整需要调整的剩余范围边界。
2. 重构生成范围列表的代码，以一次给出一个范围。

Answer 2

我在使用文本荧光笔时遇到了这个问题。当您修改您要搜索的范围的内容时，似乎发生这种情况。就我而言，我只是使用隐藏的span元素来封装我的文本，而不是试图解析范围本身，然后使用隐藏范围的类来操作其内容，然后解开隐藏的范围。

它可能不适用于你的情况，但对我来说，解决的办法是简单地将范围扩大到一个div元素，该元素包含我正在修改的那个元素。