So markieren Sie Text mit Regex

Question

Ich versuche, ein Skript zu schreiben, um zu markieren, wenn Übereinstimmung mit Regex. Unten ist mein Beispiel, was ich jetzt mache.

var text = "SOMETHING ~WEIRDs~ AND Not WEIRD"; 
 
var regexp = /\b(WEIRD)\b/ 
 
var matches = text.match(regexp); 
 

 
for (i = 0; i < matches.length; i++) { 
 
    var replace_all = RegExp(matches[i] + "(?![^<]*>|[^<>]*<\/)", "ig"); 
 
    text = text.replace(eval(replace_all), "<span style='background- color:yellow'>" + matches[i] + "</span>"); 
 
} 
 
console.log(text);

Die Ausgabe des obigen Codes ist

SOMETHING ~<span style='background- color:yellow'>WEIRD</span>s~ AND Not <span style='background- color:yellow'>WEIRD</span> 

Der Ausgang I will

SOMETHING ~WEIRDs~ AND Not <span style='background- color:yellow'>WEIRD</span> 

Ich mag würde wissen, dass auf jeden Fall ein schreiben ist Regex enthält Regex und Wörter zur Verfügung gestellt? Oder haben Sie eine andere Methode, um dieses Problem zu lösen?

Answer 1

Ihre äußere Regex ist in Ordnung. Das Problem ist mit der inneren replace_all Regex in der Schleife, da es alle Instanzen der gefundenen Zeichenfolge ersetzt, unabhängig von ihrer Position in der ursprünglichen Zeichenfolge.

Statt den ursprünglichen Regex mit replace() verwenden, um die Spiele innerhalb der Ersatzzeichenfolge verwenden, wie folgt aus:

var text = "SOMETHING ~WEIRDs~ AND Not WEIRD"; 
 
var regexp = /\b(WEIRD)\b/ 
 
var text = text.replace(regexp, '<span style="background-color: yellow">$1</span>'); 
 
console.log(text);

Auch als allgemeine Regel, nie, nie eval() verwenden. Es gibt immer eine bessere Lösung oder Alternative.