WebTecNote

[JS]Table内セルを自動的にストライプにする

1行間隔でストライプとか、何行おきかで線が引いてあるTableをたまに見ますが、
いちいちclass追加してると面倒なのでjavacript使った方が早いよね。
っていうことでそういう感じのことをするスクリプトのサンプル。

左:1行間隔でセルの背景色変える
右:3行間隔で線を引く

背景色変えるだけなら非常に簡単です。
数字を変えて試してみてください。

//クラスを追加する間隔
var Skip =2;
//スタートする場所
var Start =1;
//要素のID
var tableid =”stripes”;

window.onload = function() {
if(document.getElementById(tableid)) {
var table = document.getElementById(tableid);
if(!table) return false;
var rows = table.getElementsByTagName(‘tr’);
for(var i = 0; i

モバイルバージョンを終了