javascript - 使用 javascript 正则表达式使引用的文本变得漂亮

Question

我想制作以 > 为前缀的文本行被包裹在 <span class="quoted"></span> .

这是我的代码:

$(document).ready(function(){
    x = $('DIV#test').html();
    x = x.replace(/(^|\n)&gt;([^\n]+)(\n|$)/g, "$1<span class=\"quoted\">$2</span>$3");
    $('DIV#test').html(x);
});

我找不到原因，但这只会在 Chrome 中引用奇数行，而在 IE 中会使所有文本变成灰色。你知道这段代码有什么问题吗？

jsFiddle 演示:http://jsfiddle.net/jBJ6V/1/

Answer 1

在正则表达式上使用m(“多行”)标志，而不是从一开始就进行交替(并对生成的捕获组进行必要的调整):

$(document).ready(function(){
    x = $('DIV#test').html();
    x = x.replace(/^&gt;([^\n]+)$/gm, "<span class=\"quoted\">$1</span>");
    // Changes:    ^----here----^      ^--here                ^^--here-^
    $('DIV#test').html(x);
});

Updated fiddle

m 标志告诉正则表达式将 ^ 和 $ 视为相对于各个行，而不是相对于整个字符串。更多内容请参阅 15.10.2.6和 15.10.2.7规范，和 on MDC .