Question

我有一个包含5到6个单词的字符串，我想用荧光笔样式替换一些单词。

$(document).ready(function() {
     var str = "Micromax Samsung S3 Microsoft Galaxy S";
     var arr = ["Micro", "s"];
     arr.forEach(function(item) {
          str = str.replace(new RegExp(item.replace(/\+/g, "\\+"), "g"), '<span class="red">'+ item +'</span>');
     })
     $('#dvHtml').html(str);
});

但我得到整个字符串中的每一个包括但我不想替换。

任何正文都可以帮我排除或忽略来自替换的以下项目

输出

现在，这将用Micro替换 Micro ，用s替换 s

以下是输出 enter image description here

Answer 1

你需要改变你的正则表达式

var str = "Micromax Samsung S3 Microsoft Galaxy S";
var arr = ["Micro", "s"];
var t = str.replace(new RegExp('\\b('+arr.join('|')+')',"gi"), '<span class="red">$1</span>');

$('#dvHtml').html(t);

在此

\b - 在开头词中找到
arr.join('|') - 返回a|b之类的字符串 - 所以找到其中任何一个
gi - global和ignore case

您可以在JSFiddle

上试用

Answer 2

这里有另一个解决方案。

function escapeRegExp(str) {
  return str.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&");
}

function highlight(str, needle){      
      var parts = str.split(/<[/]?span.*?>/gi);
      for(var i=0; i<parts.length; i++){
          if(i%2 == 0){            
              parts[i] = parts[i].replace(new RegExp("("+escapeRegExp(needle)+")", 'gi'), '<span class="red">$1</span>');        
          }else{
              parts[i] = '<span class="red">'+ parts[i] +'</span>';                
          }
      }
      return parts.join('');    
}

$(document).ready(function() {
   var str = "Micromax Samsung S3 Microsoft Galaxy S";
   var arr = ["Micro", "S"];
   arr.forEach(function(item) {
        str = highlight(str, item);
   });
   console.log(str);
   $('#dvHtml').html(str);
});

这个的优点是你可以在处理过的字符串上多次重新应用高亮方法。

JSFiddle：http://jsfiddle.net/edgarinvillegas/4ZK7W/2/

此外，您可以在要搜索的字符串中包含特殊字符。例如，var arr = ["Micro", "Sam|"]不突出显示“Sam”，但突出显示“Sam |”如果它存在于str。

来自拉巴斯玻利维亚的干杯

Answer 3

不要重新发明轮子。这里有一个突出显示插件来处理这个问题：

http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html

希望它有所帮助。干杯，来自玻利维亚拉巴斯

如何使用正则表达式忽略字符串替换中的某些单词

3 个答案: