2

テーブル全体のさまざまなセルで「はい」という単語が使用されている HTML テーブルがあります。テーブル全体で「はい」の色を緑に変えたいです。もちろん、すべての "yes" 単語を span タグに入れてクラスを指定し、クラスにスタイルを適用することもできますが、すべての yes 単語の周りに span タグを配置する必要があります...確かにそこにあるこれを行う際にスペースと労力を節約する方法である必要がありますか?

4

4 に答える 4

6

jQuery にはすばらしい :contains セレクターがあります。

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

$("td:contains('yes')").css("color", "red");
于 2012-05-29T16:24:26.070 に答える
5

これを実現する唯一の方法は、各単語をスパンでラップし、それにスタイルを適用して色を緑色にすることです。次のような正規表現を使用すると、ページ内のすべての「はい」の単語をすばやく見つけることができます。

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

これにより、html タグの外側にあるすべての「はい」の単語が検出されます。したがって、最終的なコードは次のようになります。

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

正規表現の説明:

中間部分 ,は、部分(\byes\b)式として "yes" である単語全体に一致します。正規表現の最初のビットはlookbehind(?<!-)と呼ばれ、正規表現の最後のビットはlookaheadと呼ばれます。基本的に、いくつかの非文字と aが続かず、ハイフンが前後にない「はい」という単語全体をすべて見つけてください。これらのルックアラウンドは、正規表現が、タグまたはその属性内に表示される "yes" と一致すること、およびハイフンでつながれた単語に表示されることを防ぎます。i と g は、検索で大文字と小文字を区別しない (つまり、"Yes" と "yes" に一致する) ようにし、検索をグローバルにする (文字列内のすべてのインスタンスに一致する) ことを示すフラグです。置換文字列では、(?!([^<]+)?>)(?!-)'<''>'$1は後方参照であり、最初に一致した部分式をここに挿入します。この場合、一致した文字列に表示される単語「yes」です。

于 2012-05-29T16:26:10.593 に答える
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;
}
于 2012-05-29T16:23:27.133 に答える
0

jquery を使用する場合は、次のようなものを使用できます。

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

「はい」または文字列に入力したものがそのhtmlコンテンツ全体である場合にのみ機能します<td>

于 2012-05-29T16:24:18.537 に答える