javascript - 遍历字符串并使用 javascript 添加标签

Question

我正在做一个网站项目，我有一个包含项目列表的段落(它可以很好地用作 ul，但需要保持 p ) 需要每个项目的第一个字母粗体。我创建了一个函数来执行此操作:

function inserter(string, splitter, skip) {
    var array = string.split(splitter);
    var len = array.length;

    for(var i = 1; i < len; i++) {
        var a = array[i];
        var b = '<b>';
        var c = '</b>';
        if(a.substr(0, 3) != skip){ 
            array[i] = splitter + b + a.substr(0,1) + c + a.substr(1);
        } else { 
            array[i] = splitter + a; 
        }
    }
    var strFix = array.join("");
    return strFix;
}

$(function(){
    var text = $(".caps").html();
    text = inserter(text, ': '); //bold the item after ': '
    text = inserter(text, ', ', 'and'); // now bold after the comma ', ' and the skip variable which matches first three letters so the last and doesn't get bold
    text = inserter(text, ', and '); //now for the item after the last 'and'
    $(".caps").html(text);
});

但它需要被调用，并且字符串会针对每个不同的拆分器进行迭代(这可能会破坏具有多个拆分器的页面的性能)，我想知道如何只调用它一次以便所有拆分器都在一次迭代中查看过？

示例页面:

http://heidikratzke.com/about.php

当您看到该页面时，您会看到我将在一个 jQuery 幻灯片中对多个段落执行此操作。

如果这看起来不会对较慢的浏览器造成性能影响，我将保持原样。

感谢有关如何做得更好的任何建议。

Answer 1

您可以做的一个优化是使用您用来将字符串拆分为数组的拆分器，以便在操作完成后加入数组:

function inserter(string, splitter, skip) {
    var array = string.split(splitter);
    var len = array.length;

    for(var i = 1; i < len; i++) {
        var a = array[i];
        var b = '<b>';
        var c = '</b>';
        if(a.substr(0, 3) != skip){ 
            array[i] = b + a.substr(0,1) + c + a.substr(1);
        } else { 
            array[i] = a; 
        }
    }
    return array.join(splitter);

}

您可能还可以在这里做更多的事情，但这让我很吃惊。

进一步优化

下面的语句在循环外获取变量声明:

function inserter(string, splitter, skip) {
    var array = string.split(splitter);
    var len = array.length;
    var i, a, b='<b>', c='</b>';

    for(i = 1; i < len; i++) {
        a = array[i];
        if(a.substr(0, 3) != skip){ 
            array[i] = b + a.substr(0,1) + c + a.substr(1);
        } else { 
            array[i] = a; 
        }
    }

    return array.join(splitter);    
}