jquery - 将类别应用于单词的所有出现

Question

这是我的 JS 文件:

$(document).ready(function () {
    $("div:contains('Fail')").each(function () {
        $(this).html($(this).html().replace("Fail", "<span class='red'>Fail</span>"));
    });
    $(".title").html(function(i,v){
        return v.replace("Pass","<span class='red'>Pass</span>");
    });
});

和 HTML:

 <div class='title'>
     <table border="1" class="dataframe">
         ....
         .....
         <td>Pass</td>
         <td>0.55</td>
         <td>Pass</td>
         <td>Pass</td>
      </table>
  </div>

当我运行这个“红色”类时，它只应用于第一次出现的通过和失败。我如何将它应用于 div 标记中所有出现的地方。

Answer 1

您将需要使用正则表达式替换为 global match modifier g :

$(document).ready(function () {
    $("div:contains('Fail')").each(function () {
        $(this).html($(this).html().replace(/Fail/g, "<span class='red'>Fail</span>"));
    });
    $(".title").html(function (i, v) {
        return v.replace(/Pass/g, "<span class='green'>Pass</span>");
    });
});

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

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='title'>
    <table border="1" class="dataframe">
        <td>Pass</td>
        <td>0.55</td>
        <td>Fail</td>
        <td>Pass</td>
    </table>
</div>

顺便说一句，像我在上面的演示中所做的那样，为“通过”使用类似 green 类的东西是有意义的。