使用 jquery 过滤带有颜色的单词答案

【问题标题】：Filter words with color using jquery使用 jquery 过滤带有颜色的单词
【发布时间】：2014-03-06 05:39:27
【问题描述】：

我在过滤器中找到了censors 单词的这段代码，但我希望它具有不同的background color 或different text color（如红色），而不是过滤。

无论我尝试过什么，我都对 jsfiddle 发表了评论。

这是Jsfiddle

http://jsfiddle.net/xe2Zj/257/

请帮忙

【问题讨论】：

标签： jquery html

【解决方案1】：

http://jsfiddle.net/xe2Zj/258/

由于您想标记特定的单词，<mark> 似乎是这项工作的好人选。您可以使用 CSS 为您的 mark 设置样式。

我只是改变了这两行：

$('.post').text(function(i, txt){

到

$('.post').html(function(i, txt){

这个来自

var replacement = '*'.repeat(filter[i].length);

到

var replacement = '<mark>' + filter[i] + '</mark>';

编辑：再多simpler solution：

var filter = [' ass ', ' words '],
    reg = new RegExp("(" + filter.join("|") + ")", "g");

$(".post").html(
    $(".post").html().replace(reg, "<mark>$1</mark>")
);

【讨论】：

哇 thnx 兄弟，你能告诉我如何改变文字颜色，以防万一吗？
thnx man..但是我不能将背景从黄色更改为其他颜色，我认为默认情况下是黄色
@User211 是的，黄色背景是mark 的默认样式。在我之前的评论中，我添加了另一个白色背景的链接。顺便说一句，用更简单的解决方案查看我的更新
thnx 再次...我是 jquery 的新手..在输入的同时我也可以做到这一点，而不是在 p 标签中硬编码它？使用你的新方法..
是的，在这种情况下，我猜你必须在 change 或 keyup 事件中运行 replace。

【解决方案2】：

在 Jquery 中使用包含。选择所有包含指定的文本。

var array = ["sample" , "hello"]

$.each(array , function( index, value ) {
      $( "div:contains("+value +")" ).css( "background-color", "red" );
});

【讨论】：

在给定的示例中没有divs，即使有，这会将整个 div 标记为红色，而不仅仅是单词