Javascript/ActionScript 对每个indexOf 做什么？

Question

代码下面的屏幕截图显示了我的问题。它仅对文本的一个实例进行彩虹化。

如何让此代码执行每个[rainbow]指定的[/rainbow]文本​​？

它实际上适用于 ActionScript，但它也适用于 Javascript，所以我一直在 http://jsfiddle.net 上进行测试。

var txt = "This is a [rainbow]test to show that I can[/rainbow] make whatever I want [rainbow]appear as a rainbow[/rainbow] because I am [rainbow]awesome[/rainbow].";

if ((txt.indexOf("[rainbow]") > -1) && (txt.indexOf("[/rainbow]") > -1)) {
    var firstChar = txt.indexOf("[rainbow]") + 9;
    var lastChar = txt.indexOf("[/rainbow]");

    var RAINBOWTEXT = '';
    var i = firstChar;

    while (i < lastChar) {
        RAINBOWTEXT += txt.charAt(i);
        i++
    }
    var text = RAINBOWTEXT;
    var texty = '';

    colors = new Array('ff00ff', 'ff00cc', 'ff0099', 'ff0066', 'ff0033', 'ff0000', 'ff3300', 'ff6600', 'ff9900', 'ffcc00', 'ffff00', 'ccff00', '99ff00', '66ff00', '33ff00', '00ff00', '00ff33', '00ff66', '00ff99', '00ffcc', '00ffff', '00ccff', '0099ff', '0066ff', '0033ff', '0000ff', '3300ff', '6600ff', '9900ff', 'cc00ff');
    var i = 0;

    while (i <= text.length) {
        var t = text.charAt(i);

        if (t != undefined) {
            texty += "<font color=\"#" + colors[i % colors.length] + "\">" + t + "</font>";
            i++;
        }
    }

    texty = texty.replace("> <", ">&nbsp;<");
    var REPLACEME = "[rainbow]" + RAINBOWTEXT + "[/rainbow]";
    txt = txt.replace(REPLACEME, texty);
    document.write(txt);
}​

Answer 1

如果我们可以假设 [rainbow] 标签没有交错或嵌套，我只需使用带有简单 replacer callback 的正则表达式即可。 :

var rainbowified = txt.replace(/\[rainbow\](.*?)\[\/rainbow\]/, function(textWithTags, textBetweenTheseTags) {
    var text = textBetweenTheseTags;
    ....
    for(var i = 0; i < text.length; ++i) {
        // rainbowify each letter of text...
    }
    ...
    return textWithFontTags;
}

您可以使用它来获取具有所需转换的新字符串。

此外，font 标签已被弃用；您应该在 style 属性中使用 span 和 color:#XXXXXX。