jqueryの複数のサブ文字列の複数の出現を置き換えます

Question

配列の要素[]内に配列が見つかった場合、配列要素に対して文字列の文字配列をチェックする小さなプログラムがあります。しかし、これは、以下のメカニズムを使って、私のための配列の最初のインスタンスマッチでのみ機能します。これを複数回発生させるにはどうしたらよいですか？

例：プログラムに与えterms = ['hello', 'world', 'this', 'is', 'me']

文字列である：hello here is me

プログラムは赤と緑の単語と、アレイ内の単語のいずれとも一致した文字列に見出される単語を置き換えるように求められますそれぞれ、しかしプログラムは、見つかった最初の発生で停止し、それは、現在プログラムされたシステムからの結果である：

'red here is me' 

代わりの

'red here green me' 

次の機能を変更して2番目の結果を得るにはどうすればよいですか？

私はあなたが私を理解しているとは思わない、私はCSSについて気にしないと思います。

ここに私の現在のコード

function check(string) { 
    var terms = ['one', 'two']; 
    var match = false; 

    for(var i=0;i<terms.length;i++) { 

     if(string.indexOf(terms[i]) > -1) { 
      match = true; 
      var newString=''; 
      var matchString = string.substring(string.indexOf(terms[i]), (string.indexOf(terms[i])+terms[i].length)); 

      switch(matchString) { 
       case 'one': 
       newString = string.replace(matchString, "three"); 
       break; 
       case 'two': 
       newString = string.replace(matchString, "four"); 
       default: 
       alert('no matches'); 
      } 

      $("ul").append("<li>" + newString + "</li>"); 
     } 
     } 
    } 

チェックが（「これは2の一例文字列である」）です。この中

現在

私のプログラムの結果： これは私がこれをもたらすために私のプログラムを修正したい

の例の文字列です： これはの例の文字列です4つの

Answer 1

String#replaceを置換機能で使用し、色を交換します。

function replaceWithColor(str, terms) { 
 
    var termsDict = terms.reduce(function(d, t) { 
 
    d[t] = true; 
 
    return d; 
 
    }, Object.create(null)); 
 
    
 
    var colors = ['red', 'green']; 
 

 
    var i = 0; 
 

 
    return str.replace(/\w+/g, function(t) { 
 
    return termsDict[t] ? colors[i++ % 2] : t; 
 
    }); 
 
} 
 

 
var terms = ['hello', 'world', 'is', 'me']; 
 

 
var str = "hello here this is me"; 
 

 
var result = replaceWithColor(str, terms) 
 

 
console.log(result);

そしてSetと矢印の機能を使用していますES6バージョン：

const replaceWithColor = (str, terms) => { 
 
    const termsSet = new Set(terms); 
 
    
 
    const colors = ['red', 'green']; 
 

 
    let i = 0; 
 

 
    return str.replace(/\w+/g, (t) => termsSet.has(t) ? colors[i++ % 2] : t); 
 
} 
 

 
var terms = ['hello', 'world', 'is', 'me']; 
 

 
var str = "hello here this is me"; 
 

 
var result = replaceWithColor(str, terms) 
 

 
console.log(result);

Answer 2

var terms = ['hello', 'world', 'this', 'is', 'me']; 
 

 

 
function check(str) { 
 
    var 
 
    s = str.split(' '); 
 
    out = [], 
 
    redgreen = ['red','green'], 
 
    rgcount = 0; 
 
    
 
    s.forEach(function (k, i) { 
 
    if (terms.indexOf(k) >= 0) { 
 
     var color = redgreen[rgcount]; 
 
     out.push('<span class="'+color+'">'+color+'</span>'); 
 
     rgcount = (rgcount + 1) % 2; 
 
    } else out.push(k); 
 
    }); 
 
    document.write(out.join(' ')+'<br/>'); 
 
} 
 

 
check('hello here is me'); 
 
check('one two there is three four pink yelow there is this what yet there'); 
 
check(terms.join(' '));

.red { 
 
    color: red 
 
} 
 
.green { 
 
    color: green; 
 
}