0

次のように、テーブルの行にセルの 1 つのクラスを指定します。

私はこのテーブルを持っています、

<table id="mytable">
 <tr>
  <th>Name</th>
  <th>Favorite color</th>
 </tr>
  <td>James</td>
  <td>red</td>
 </tr>
 <tr>
  <td>John</td>
  <td>blue</td>
 </tr>
</table>

で、このまま終わってほしい。

<table id="mytable">
 <tr>
  <th>Name</th>
  <th>Favorite color</th>
 </tr>
 <tr class="red">
  <td>James</td>
  <td>red</td>
 </tr>
 <tr class="blue">
  <td>John</td>
  <td>blue</td>
 </tr>
</table>

これは可能ですか？

4

2 に答える 2

4

addClass次の方法を使用できます。

$('tbody tr').addClass(function(){
    return $('td:last', this).text()
})

http://jsfiddle.net/SwELe/

trの前に開始タグがないことに注意してください<td>James</td>。

于 2012-11-21T15:06:31.140 に答える
0

そこにあるHTMLを使用して：

$("tr:not(:first)").each(function(i) {
    $(this).addClass($(this).children("td").last().text());
});

jsFiddle (別名、例)

これが何をするか：

  • $ = jQueryの省略記号
  • ("tr = jQuery セレクターの開始。この場合、タグから開始します。tr
  • :not = これは、括弧内にあるものを選択しないようにセレクターに指示します
  • (:first) = これは のパラメーターです:not。この場合、要素選択全体で最初の要素が必要ないことを伝えていました。
  • .each( = この jQuery 関数は、選択された要素に対して For ループのように機能します
    • jQueryオブジェクトは0インデックスベースです（つまり、0から始まりカウントアップします）
  • function(i) { = これはcallback、.each 呼び出しの関数の始まりです。iは、通過する各要素のインデックスを表します
  • $(this) = この jQuery セレクターは、ループ内の現在の要素を取得しています
  • addClass( = この jQuery 関数を使用すると、要素にクラス名を追加できます
  • $(this) = 再び、操作中の現在の要素を参照
  • .children("td") = 現在の要素は TR であるため、その子はtd's である必要があることがわかっているため、子セレクターを使用してそれらの子を取得します
  • .last() = これは、オブジェクト コレクションの最後の要素のみが必要であることをセレクターに伝えます。
  • .text() = これは、選択した要素のテキストが必要であることをセレクターに伝えます
  • ); }); = 単純にすべてを閉じます!
于 2012-11-21T15:09:06.737 に答える