Question

我们有bug at this CKEditor plugin，通用解决方案是like to this，只将通用字符串过滤器应用于DOM的终端文本节点。

问题：如何（需要代码示例）通过CKEditor-4工具遍历选择节点（editor.getSelection()），例如CKEDITOR.dom.range？

Answer 1

第一步是从当前选择中获取范围。要做到这一点，只需致电：

var ranges = editor.getSelection().getRanges();

这为您提供了一系列范围，因为理论上（这个理论仅由Firefox证明）一个选择可以包含许多范围。但在99％的现实案例中，您只需处理第一个案例而忽略其他案例。所以你有range。

现在，迭代此范围内每个节点的最简单方法是使用CKEDITOR.dom.walker。以这种方式使用它：

var walker = new CKEDITOR.dom.walker( range ),
    node;

while ( ( node = walker.next() ) ) {
    // Log values of every text node in range.
    console.log( node.type == CKEDITOR.NODE_TEXT && node.getText() );
}

但是，范围边界处的文本节点存在问题。请考虑以下范围：

<p>[foo<i>bar</i>bo]m</p>

这将记录：foo，bar和bom。是的 - 整个bom，因为它是单个节点而 walker不会修改DOM （文档中存在错误）。

因此，如果等于范围startContainer或endContainer，则应检查要转换的每个节点，如果是，则仅转换范围内的那部分。

注意：我不知道walker的内部结构，我不确定是否可以在迭代时修改DOM。我建议先缓存节点，然后再进行更改。

遍历CKEditor-4中的DOM节点

1 个答案: