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

迭代字符串并使用javascript添加标签

1 个答案: