勉強したことのメモ

webプログラマ見習いが勉強したことのメモ。

jQueryで偶数or奇数行にclassを付与

      2014/07/02

やりたかった事は、

PHPは使えなくてjavascriptjQueryを使用
・テーブルの0行目を除く偶数行のtrタグにclassを付与したい

というもの。0行目はthタグになってる。

■ソース
var reverse_num = $("#table_id").find("tr").size();
for (var i = 0; i < reverse_num; i++) { //偶数行にclass=reverseを付与
if (i != 0 && (i % 2 == 0)) {
$("#table_id").find("tr").eq(i).addClass('reverse');
}
}

■その他
size()
http://semooh.jp/jquery/api/core/size/_/
オブジェクトのエレメント数を返す。

table_id内のtrタグの数を数えて、その回数分ループを回し、
0行目を除く偶数行にclass=reverseを付与するという内容

 - javascript, jQuery

  関連記事

images
PHPの配列をファイルに保存してPHPやJSで呼び出す

PHPの配列をファイルとして保存し、別のページからPHPやJavaScriptで ...

javascript_logo_unofficial-300x300
javascriptで画像を取り扱う際の注意

javascriptで画像を取り扱う際に、 ちゃんと要素を指定しているのにも関わ ...

jquery_logo
jQueryのfind時に複数のセレクタ指定

<div id="hoge"> <a href="aaa.ht ...

javascript_logo_unofficial-300x300
javascriptで論理和演算子の特殊な使い方

論理和「||」の特殊な使い方を教わったのでメモ。 普段使うのは、 if (a = ...

jquery_logo
POP広告をjQueryで再現する方法

サイト内のリンクをクリックすると、新しいタブもしくはウィンドウで開く広告をちょい ...

javascript_logo_unofficial-300x300
javascriptでスクロール

やりたかった事は、 ・javascript,jQuery使う ・スクロールさせた ...

110126-HTML5_Logo
formでdisplay:none;にしてても送信される

formで特定の部分をdisplay:none;で非表示にしてても 内容は送信さ ...

jquery_logo
スマホ対応カルーセルスライダーslickの使い方

イメージスライダーでslickという使ったことないjQueryプラグインを見かけ ...

jquery_logo
jQuery UI Datepickerで日本の祝祭日を表示

やりたかった事は、jQueryのカレンダーピッカーで 日本の祝祭日の色を変えると ...

jquery_logo
jQueryで配列の値を検索

やりたかった事は、配列の中に特定の値があるか どうか検索し、その後の分岐を行いた ...