関数の引数には効果を適用したいtable要素のidを指定します。

カンマでidを区切ることで、複数のtable要素を指定できます。

実行はbody要素のonloadイベントで呼び出すのが一般的でしょう。勿論上記サンプルのようにform要素やa要素で呼び出すことも出来ます。

効果を適用したいtable要素にはid属性を設定しておく必要があります。

奇数行、偶数行各々のスタイルをCSSで設定します。

スクリプトは指定されたtable要素の奇数番目のtr要素のclass属性をoddに、偶数番目のtr要素のclass属性をevenに変更します。

odd, even各々に違ったプロパティを設定しておくことで、交互に行の色が変わるという仕組です。

指定されたtable中のtr要素は全てスクリプト中での対象になります。よって、サンプルのようにthead要素やtfoot要素を配置している場合、これらの要素中のtr要素に対してもスクリプトの効果は適用されます。

これらのtr要素のスタイルを変更させたくない場合には、CSSのセレクタを適切に設定しておけばよいでしょう。

例えば上記のスタイル指定の後に次の記述を加えることで、thead, tfoot要素中のtr要素に対するスタイルは上書きされるので、スクリプトによりスタイルを変更されずにすみます。

あるいは次のようにtbody要素中のtr要素というように限定したセレクタ指定もできます。

しかし、thead要素やtfoot要素を配置している場合、これらの要素中のtr要素の数によって、tbody要素中のtr要素の奇数番目、偶数番目の判断が正確に出来ません。

例えば1つのtr要素を含むthead要素とtbody要素を配置した(tfoot要素はナシ)場合、tbody要素の最初のtr要素はこのtable要素中では2番目なので偶数と判断してしまいます。

単に交互に配色されればよい場合には、このことについて気にする必要はありませんが、厳密に奇数、偶数を判断させたい場合には、スクリプトの引数にtableのid属性ではなく、tbodyのid属性を指定します。