1

我们 在这个 CKEditor 插件上有一个错误,一个通用的解决方案就是这样,只将通用字符串过滤器应用于 DOM 的终端文本节点。

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

4

1 回答 1

4

第一步是从当前选择中获取范围。为此,只需调用:

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>

这将记录:foobarbom。是的 - whole bom,因为它是单个节点,并且walker 不会修改 DOM(文档中有一个错误)。

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

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

于 2013-08-27T20:07:21.217 回答