在整個HTML表格中更改特定單詞的顏色

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 ，正則表達式的最后一位(?!([^<]+)?>)(?!-) ？！ (?!([^<]+)?>)(?!-)稱為前瞻 。 基本上它說找到我所有的全部單詞“是”沒有遵循一些非'<'字符和'>' ，並且沒有跟隨或前面的連字符。 這些外觀可以防止正則表達式匹配標記或其屬性中出現的任何“是”，並出現在帶連字符的單詞中。 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內容時才會起作用