JavaScript code for Table row-changing

DEMO code: <Br/> <table id = "datatable"> <tr> <td> footfall </td> </tr> <td> www.jb51.net </td> </ tr> <td> foothome </td> </tr> <td> www.jb51.net </td> </tr> <td> foothome </td> </tr> <td> www.jb51.net </td> </tr> <td> Home of feet </td> </tr> <tr> <td> www.jb51.net </td> </tr> </table> <p>
[Ctrl + A select all Note: If you need to introduce external Js, You need to refresh it to execute]

Core code:Copy codeThe Code is as follows: function showtable (){
Var color1 = "rgb (234,240,255 )";
Var color2 = "rgb (255,255,255 )";
Var bgColor = "rgb (255,255,193 )";
Var trs = document. getElementById ("datatable"). getElementsByTagName ("tr ");
For (var I = 0; I <trs. length-1; I ++ ){
If (I % 2 = 0 ){
Trs [I]. style. backgroundColor = color1;
Trs [I]. onmouseover = function (){
This. style. backgroundColor = bgColor;
}
Trs [I]. onmouseout = function (){
This. style. backgroundColor = color1;
}
} Else {
Trs [I]. style. backgroundColor = color2;
Trs [I]. onmouseover = function (){
This. style. backgroundColor = bgColor;
}
Trs [I]. onmouseout = function (){
This. style. backgroundColor = color2;
}
}
}
}