JavaScriptの単語数に基づいて単語を強調表示します

Question

次の文字列がある場合：This is another song you should listen to 単語カウントに基づいて単語を強調表示する機能を作成しようとしていました。たとえば、次のような方法で4番目の単語をハイライトしたいとします：highlightWord(originalString,nthWord)。そして、返される文字列は次のようになります。

This is another <span class=\"highlighted\">song</span> you should listen to

私は私が書いたhighlightMatch機能、検索文字列(regexMatch = "is")を渡すことによって、1を使用してみましたが、問題はそれがThisの代わりisにあると強調していることである。

function highlightMatch(originalValue,regexMatch) { 
    var tempInnerHTML = stripTags(originalValue); 
    originalValue.innerHTML = tempInnerHTML.replace(regexMatch,'<span class="highlighted">'+regexMatch+'</span>'); 
} 

私はまた、このhighlightNthWord方法を使用してみました：

function highlightNthWord(string,n) { 
    var m = string.match(new RegExp('^(?:\\w+\\W+){' + n + '}(\\w+)')); 
    return m && '<b>'+m[1]+'</b>'; 
} 

しかし、これは強調表示されたn番目の単語のみを返し、n番目の単語が強調表示された文全体を返しません。 私はjavascript（jqueryはありません）だけに固執したいと考えています。

あなたは文字列はスペースも分割してから戻って文字列を構築することができます

Answer 1

：

function highlightNthWord(string,n) { 
 
    var m = string.split(new RegExp(/\s+/)); 
 
    return m.splice(0, n-1).join(" ") + (' <b>'+m.splice(0, 1)+'</b> ') + m.join(" "); 
 
} 
 
console.log(highlightNthWord('This is another song you should listen to', 4))

Answer 2

が、これは

function highlightMatch(originalValue, matchString) { 
    var re = new RegExp(matchString, "igm"); 
    var replace = '<span class="highlighted">'+matchString+'</span>'; 
    return originalValue.replace(re ,replace); 
}