Регулярное выражение и обертка минус

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

Вы можете использовать lookaheads, которые будут убедиться, что мы не тег диапазона.

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

(?![^<]*</span>) опережения потерпит неудачу матч, если оператор математике следуют другие, чем < ([^<]*) нуля или более символов с последующим </span>.

Это не будет работать с вложенными <span> тегами, для этого вам понадобится парсер DOM.

Answer 2

Если вам не нужны операторы сам массив, вы можете использовать один регулярное выражение:

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