带HTML标签的环绕字符

问题描述：

我想用javascript替换文本。例如，文字是： < + ABC类> -带HTML标签的环绕字符

我想要的结果：

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

芽第二替换规则的确也替换HTML标签<和>和class属性。我该如何解决这个问题？

我们可以看到一些代码 – btevfik 2013-03-20 11:12:23

如此，what's你的代码到目前为止？ – 2013-03-20 11:12:39

一个合适的方法是构建一个标记器，将输入字符串拆分为标记，然后将每个标记包装到相应的标记（DOM元素）中。即分别处理每个部分。你可能想看看http://codemirror.net/是如何做到这一点的。 – 2013-03-20 11:13:01

答

的非常简单的例子：

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

DEMO：http://jsfiddle.net/6Np26/

谢谢！这是我需要的。 – user2190492 2013-03-20 14:11:38

@ user2190492不客气。点击左侧的勾号即可接受答案。 – VisioN 2013-03-20 14:15:33

IE8或更早版本的Bud是不支持的indexOf方法。多么糟糕。 – user2190492 2013-03-20 14:35:48

答

尝试

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(' '))

演示：Fiddle

带HTML标签的环绕字符

相关推荐