更改(document).ready上受regex影响的字符串的颜色

Change the color of strings affected by regex on (document).ready

本文关键字:影响 字符串 颜色 regex 上受 document ready 更改      更新时间:2023-09-26

我在这里要做的是,改变一些受正则表达式影响的单词的颜色。

$(document).ready(function(){
  container = $("#modal_container section").text();
  hashtags = /'#'w+/g;
  var container_hash = container.match(hashtags);
  $(container_hash).css({'color':'red'}); 
  //We're grabbing the words, but how can I change the color?
  alert(container_hash);
 });

这里有一个小提琴http://jsfiddle.net/vuDzC/2/让它更清楚。

谢谢

你不能改变textnode/text的颜色,你应该用一个元素包裹匹配的文本,然后为该元素设置样式。

$("#modal_container section p").html(function(_, html) {
   return html.replace(/('#'w+)/g, '<span class="red">$1</span>');   
});
http://jsfiddle.net/vuDzC/4/

这是您正在寻找的(或者应该是一个足够好的示例):

<script type="text/javascript">
    $(document).ready(function(){
        var text = $("#modal_container").html();
        var myRegExp = new RegExp('''#''w+','gi');
        var newtext = text.replace(myRegExp,'<span style="color:red;">$&</span>');
        $("#empty").html(newtext);
    });
</script>
<div id="modal_container">
    #works<br />
    # Desnt Work<br />
    Not Even Close<br />
</div>
<div id="empty" style="margin-top:30px;">
</div>
 $(function(){
  var container = $("#modal_container section");
  var htmlWrappedHashtags = container.html().replace(/'(#'w+)/g, '<span class="red">$1</span>');
  container.html(htmlWrappedHashtags);
  $(".red").css({'color':'red'}); // or better: include ".red {color: red;}" into your CSS
 });