使用 Rangy 读取带有跨度标签的选择答案

【问题标题】：Reading selection with its span tags with Rangy使用 Rangy 读取带有跨度标签的选择
【发布时间】：2014-03-19 12:43:01
【问题描述】：

我正在使用 Rangy 中的 CssClassApplier 为选择设置字体大小：

.font16 {font-size: 16px;}
.font17 {font-size: 17px;}
.font18 {font-size: 18px;}


var font16Applier = rangy.createCssClassApplier("font16");

function applyfont16() {
            font16Applier.applyToSelection();
        }

现在，如果有人按下“+”来增加字体大小，我希望能够读取 span 标签中的类名以进行选择，如果是 font16，请将其更改为 font17。

但我在 Rangy 中看不到任何方式来读取带有跨度标签的选择。

感谢您的帮助。

【问题讨论】：

我在您的问题中看到的代码与我在尝试实现“如果有人按下“+”...”功能时所期望的不符。包括您尝试过的代码并提供指向 jsfiddle.com 或 jsbin.com 示例的链接将大大有助于阐明您在结构方面正在使用的内容，并且确切地不起作用。或者，换句话说，它可以帮助我们帮助您。
我不确定如何使用整个 Rangy 库实现 jsfiddle。缺少的“+”代码只是：读取当前选择，包括其跨度标签，并按照上面应用 font16 的方式应用下一个字体大小。这是我不知道如何使用 Rangy 或任何其他方式的“读取当前选择，包括其跨度标签”。
左侧有一个框用于在 jsFiddle 中添加资源，您可以使用它来包含来自rangy.googlecode.com/svn/trunk/currentrelease 或rangy.googlecode.com/svn/trunk/dev 的文件。

标签： rangy

【解决方案1】：

假设您对每种字体大小都有一个类应用程序，您可以依次遍历每个字体大小并检查它是否已应用于当前选择。它的效率不是很高，但性能可能足够好。

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;
        }
    }
}

【讨论】：

谢谢蒂姆！一个类似的问题是显示选择的字体系列。我想我只需要遍历所有字体的数组并显示命中的那个。