正则表达式和换行减

Question

这是我的代码。

var string = 'number1 + number2 - number3';
var operators = [
   {o: '+', regex: '\\+'},
   {o: '-', regex: '\\-'}
];

$.each(operators, function(i, operator){
    string = string.replace(
      new RegExp(operator.regex, "g"),
      '<span class="formula-operator">' + operator.o + '</span>'
    );
});

我的CSS课程被替换了两次。我应该如何更改我的正则表达式？

Answer 1

如果您不需要运算符数组本身，则可以使用单个正则表达式：

string = string.replace(/[+-]/g, operator => '<span class="formula-operator">' + operator + '</span>');

（否则这个表达式可以基于运算符本身构建）

PS，第二次替换是因为-内有匹配（<span class="formula-operator">）

编辑：动态构建表达式的示例：

var string = 'number1 + number2 - number3';
var operators = ['+','-'];

string = string.replace(
            new RegExp('[' + operators.join('') + ']', "g"), 
      o => '<span class="formula-operator">' + o + '</span>');

Answer 2

您可以使用前瞻，确保我们不在span标记内。

var operators = [ 
   {o: '+', regex: '\\+(?![^<]*</span>)'}, 
   {o: '-', regex: '\\-(?![^<]*</span>)'} 
];

如果数学运算符后面跟着(?![^<]*</span>)（<）之后的零个或多个字符后跟[^<]*，则</span>前瞻将使匹配失败。

这不适用于嵌套的<span>标记，您需要一个DOM解析器。