如果文字包含'@'改变'@'的颜色

Question

我正在为我的问题寻找解决方案.
我有一段带有Twitter推文的文字.现在我想将所有'@'改为颜色.

这就是我在文本中寻找'@'的方法:

if (status.indexOf("@") >= 0)
{

}

但是现在我怎样才能改变@的颜色？(添加范围和类或其他东西......)

状态是一个变量,其内容为ex.像这样:

Dita Von Teese draagt geprinte 3D-jurk  <a target="_blank" href="http://t.co/s2y6b21S0I">http://t.co/s2y6b21S0I</a> via @<a target="_blank" href="http://twitter.com/Knackweekend">Knackweekend</a> 

Answer 1

没有看到你的HTML,我能提供的最好的是一个简单的替换,我假设这status是一个HTML元素/节点的jQuery集合:

status.html(function(i,h){
    return h.replace(/@/g,'<span class="atSign">@</span>');
});

加上CSS:

.atSign {
    color: #f90;
}

更新,因为status看起来是一个字符串(来自下面的评论):

var status = '<a target="_blank" href="t.co/s2y6b21S0I">http://t.co/s2y6b21S0I</a>; via @<a target="_blank" href="twitter.com/Knackweekend">Knackweekend</a>',
    newStatus = status.replace(/@/g,'<span class="atSign">@</span>');
console.log(newStatus);

JS小提琴演示.

使用CSS 为颜色@ 和以下a元素着色:

.atSign,
.atSign + a {
    color: #f90;
}

JS小提琴演示.

来包装@ 和以下a中的元素span:

var status = '<a target="_blank" href="t.co/s2y6b21S0I">http://t.co/s2y6b21S0I</a>; via @<a target="_blank" href="twitter.com/Knackweekend">Knackweekend</a>',
    newStatus = status.replace(/(@.+<\/a>)/g,function(a){
    return '<span class="atSign">' + a + '</span>';
    });
console.log(newStatus);

JS小提琴演示.

参考文献:

• html().
• JavaScript正则表达式.
• String.replace().