Wie kann man einen String mit einem Array von Wörtern vergleichen und Wörter in einem String markieren, die übereinstimmen?

Question

ich dieses Problem habe, habe ich eine Reihe von Wörtern wie dieser

let words = ['prueba', 'etiquetas']; 

und meine Schnur

let product = 'Prueba de etiquetas';

Dieses Array von Wörtern und String werden alle Mal anders sein, enthält jedes Produkt seine eigenes Array von Wörtern, und ich würde gerne wissen, welche dieser Wörter sind in der Zeichenfolge und markieren Sie diese Wörter in der Zeichenfolge, in diesem Fall, wenn ich die product Variable die Ausgabe drucken soll:

Prueba de etiquetas

bisher Mein Code ist dies

if (words.length) { 

    for (let x = 0; x < words.length; x++) { 

     if (product.toUpperCase().indexOf(words[x].toUpperCase()) !== -1) { 

      //Here I need to hightligh the words in the string 
     } 
    } 
} 

Aber ich habe keine Ahnung, wie diese Änderung in der product variabel zu machen, einige Ideen? Mache ich etwas falsch? Ich hoffe du kannst mir helfen, danke.

Answer 1

Konvertieren das Array zu einem regulären Ausdruck und verwenden String#Replace die Worte mit einer Spannweite zu wickeln:

const words = ['prueba', 'etiquetas']; 
 
const product = 'Prueba Pruebaa de etiquetas aetiquetas'; 
 

 
// convert the array to a regular expression that looks for any word that is found in the list, regardless of case (i), over all the string (g) 
 
const regexp = new RegExp(`\\b(${words.join('|')})\\b`, 'gi'); 
 

 
// replace the found words with a span that contains each word 
 
const html = product.replace(regexp, '<span class="highlight">$&</span>'); 
 

 
demo.innerHTML = html;

.highlight { 
 
    background: yellow; 
 
}

<div id="demo"></div>

Answer 2

können Sie verwenden regex:

var words = ["product", "words"], 
 
    product = "This arrAy of wOrds aNd String wiLl be dIFferent all tiMe, evEry pRoduCt conTaiNs its own arRay oF words."; 
 
    
 
var regex = new RegExp('(' + words.join('|') + ')', "ig"); 
 

 
document.body.innerHTML = product.replace(regex, "<b>$1</b>");

Answer 3

Hier ist eine Lösung ohne regex:

let words = ['prueba', 'etiquetas']; 
 
let product = 'Prueba de etiquetas'; 
 

 
words = words.map(function(word) { return word.toLowerCase(); }); 
 

 
product = product.split(' ').map(function(word) { 
 
      return words.indexOf(word.toLowerCase()) >= 0 ? '<b>'+word+'</b>' : word; 
 
      }).join(' ') 
 

 
console.log(product);