javascript - 使粗体字以@开头的单词

This question already has answers here:

Regex, replace all words starting with @
                                
                                    （5个答案）
                                
                        
                                3年前关闭。
            
                    
我想将任何以“ @”字符开头的单词设置为“ bold”字体。例如替换字符串：


  ``@xyzharris有一只猫@zynPeter''


与：


  ``@xyzHarris有一只猫@zynPeter''

最佳答案

如果您的目标元素不包含任何子元素（较简单的变体）：

$("p:contains(@)").html(function(i, h){
 return h.replace(/(@\w+)/g, '<b>$1</b>');
});

b{color:red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>@xyzharris has a cat @zynPeter</p>
<p>This is @roko answer to @user21.</p>
<p>@cats like @dogs. A lot.</p>

只要确保您在p选择器中包含纯字符串即可。除此以外，


如果您的目标元素包含内部子元素：

$('p, p *').contents().filter(function() {
  return this.nodeType === 3;
}).text(function(i, t) {
  $(this).replaceWith(t.replace(/(@\w+)/g, '<b>$1</b>'));
});

b{color:red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p><a href="#">@xyzharris has a</a> cat @zynPeter</p>
<p>This is <span>@roko answer</span> to @user21.</p>
<p>@cats <i>like @dogs</i>. <span>A lot</span>.</p>

在上面的正则表达式中，您看到我使用\w代表


  \w匹配任何字母，数字或下划线。


对于@ us3rn4_me来说，这似乎很酷。相反，如果要确保匹配除空格以外的所有字符，请使用：


  \S匹配空格，制表符或换行符以外的任何内容。


+量词确保重复前面的\w表达式


  +一次至无限次，并尽可能多次，并根据需要进行回馈[贪婪]