javascript - 文字を HTML タグで囲む

Question

javascript のテキストを置き換えたい。たとえば、テキストは次のとおりです。 < + class abc > -

結果が欲しい：

<span class="operators"> < </span><span class="operators"> + </span>
<span class="keywords">class</span> abc <span class="operators"> > </span>
<span class="operators"> - </span>

Bud の 2 番目の置換ルールも、HTML タグの < と >、および class 属性を置換します。どうすればこの問題を解決できますか?

Answer 1

非常に基本的な例:

var operators = ["<", "+", "-", ">"],
    keywords  = ["class"];

"< + class abc > -".replace(/[^ ]+/g, function(m) {
    if (operators.indexOf(m) > -1)
        return '<span class="operators">' + m + '</span>';
    else if (keywords.indexOf(m) > -1)
        return '<span class="keywords">' + m + '</span>';
    return m;
});

デモ: http://jsfiddle.net/6Np26/

Answer 2

試す

var x = '< + class abc > -';
var array = x.split(/\s/);

var ops = /^[<>+-\/]$/;
var keywords = /^(class)$/

var result  = [];
for(var i = 0; i <  array.length; i++){
    var item =  array[i];
    if(ops.test(item)) {
        result.push('<span class="operators"> ' + item + ' </span>')
    } else if(keywords.test(item)){
        result.push('<span class="keywords"> ' + item + ' </span>')
    } else {
        result.push(item)
    }
}

console.log(result.join(' '))

デモ:フィドル