javascript - Rangy遍历getSelection类

我使用Tim的Rangy Library制作了一个“简单”文本编辑器，我对Italic，Bold，Strike和Underline使用了静态类，例如：

myCss.css

.n {
    font-weight: bold;
}

.i {
font-style: italic;
}

.t {
text-decoration: line-through;
}

.s {
    text-decoration: underline;
}

如果我想切换特定的类，我只是发送了该值，因此它将在createClassApplier中使用，并将其应用于这样的选择：

applier = rangy.createClassApplier("n");
applier.toggleSelection();

它工作完美。现在我正在尝试实现前景色和背景色，我考虑过创建一个称为前台的动态样式类，并为用户选择的文本样式设置颜色（从颜色选择器中选择），或者使用类似

.color1 {
text-decortion-color: red;
}

.color2 {
text-decortion-color: blue;
}

然后继续

但是以这种方式，我需要获取所选的文本类，然后进行迭代并检查其是否已设置，如果没有，请删除其他设置的颜色，然后添加新的颜色（困难的方式？）

我更喜欢使用类似：

applier = rangy.createClassApplier("f");
applier.text-decoration-color: #000FFF;

但是它在我的脑海里是不会工作的..

如果迭代是“困难的方式”，那么为背景和前景应用颜色的最佳/最佳方法是什么？

最佳答案

Rangy的创建者发现并提供了一种很好的方法->

https://stackoverflow.com/a/22528320/2582318

为每种颜色创建新的应用程序，然后遍历颜色以检查其是否已应用

var font16Applier = range.createCssClassApplier("font16");
var font17Applier = range.createCssClassApplier("font17");
var font18Applier = range.createCssClassApplier("font18");

var appliers = [font16Applier, font17Applier, font18Applier];

for (var i = 0, len = appliers.length; i < len; ++i) {
    if (appliers[i].isAppliedToSelection()) {
        if (i < len - 1) {
            appliers[i].undoToSelection();
            appliers[i + 1].applyToSelection();
            break;
        }
    }
}

关于javascript - Rangy遍历getSelection类，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/33303233/