Question

我有一个HTML表格，在整个表格的各个单元格中都使用了“yes”。我想在整个表格中将“是”的颜色更改为绿色。现在我显然可以将所有“yes”单词放在span标签中并给它一个类，将一个样式应用到类中，但是我必须在每个单词的周围添加一个span标签...肯定在那里这样做必须节省空间和精力吗？

Answer 1

实现此目的的唯一方法是将每个单词包装在一个范围中，然后对其应用样式以使颜色变为绿色。您可以使用这样的正则表达式快速找到页面中的所有“是”字词：

 /(?<!-)(\byes\b)(?!([^<]+)?>)(?!-)/ig

这将找到html标签之外的所有“是”字样。所以最终的代码是这样的：

$('td').each(function(){
   $(this).html(
        $(this).html()
       .replace(
              /(?<!-)(\byes\b)(?!([^<]+)?>)(?!-)/ig, 
             '<span style="color:green;">$1</span>'
        )
    );
});

正则表达式的解释：

中间部分(\byes\b)匹配作为子表达式的“是”的整个单词。正则表达式的第一位(?<!-)称为lookbehind，正则表达式的最后一位(?!([^<]+)?>)(?!-)称为lookahead。基本上它说找到我所有的全部单词“是”没有遵循一些非'<'个字符和'>'，并且没有跟随或前面的连字符。这些外观可以防止正则表达式匹配标记或其属性中出现的任何“是”，并出现在带连字符的单词中。 i和g是标志，表示使搜索大小写不敏感（因此它匹配“是”和“是”），并使搜索全局（匹配字符串中的所有实例）。在替换字符串中，$1是一个反向引用，表示在此处插入第一个匹配的子表达式，在这种情况下，匹配字符串中出现的单词“是”。

Answer 2

jQuery有很棒的：包含选择器：

http://api.jquery.com/contains-selector/

$("td:contains('yes')").css("color", "red");

Answer 3

猜猜JS

var tables = document.getElementsByTagName('td');
for(var i = 0; i < tables.length; i++)
{
    var s = tables[i].innerHTML;
    s = s.replace('yes', '<span style="color:green">yes</span>');
    tables[i].innerHTML = s;
}

Answer 4

如果你使用jquery，你可以使用类似的东西：

$('#tableID')
  .find('td')
    .each(function () {
      if ($(this).html() == 'yes') {
        $(this).addClass('MyClass');
      }
    });

只有在'是'时才会起作用，或者你在字符串中放入的任何内容都是<td>的整个html内容

在整个HTML表格中更改特定单词的颜色

4 个答案: