1 2 <html> 3 <head> 4 <script> 5 function init () { 6 var tables = document.getElementsByTagName("table"); 7 for (var i = 0; i < tables.length; i++) { 8 if (tables[i].className.match(/zebra/)) { 9 zebra(tables[i]); 10 } 11 } 12 } 13 14 function zebra (table) { 15 var current = "oddRow"; 16 var trs = table.getElementsByTagName("tr"); 17 for (var i = 0; i < trs.length; i++) { 18 trs[i].className += " " + current; 19 current = current == "evenRow" ? "oddRow" : "evenRow"; 20 } 21 } 22 </script> 23 <style> 24 tr.oddRow { background-color: green; } 25 tr.evenRow { background-color: red; } 26 </style> 27 </head> 28 <body onload="init()"> 29 <table class="zebra"> 30 <tr> <td>foo</td> <td>foo</td> <td>foo</td> </tr> 31 <tr> <td>bar</td> <td>bar</td> <td>bar</td> </tr> 32 <tr> <td>foo</td> <td>foo</td> <td>foo</td> </tr> 33 <tr> <td>bar</td> <td>bar</td> <td>bar</td> </tr> 34 <tr> <td>foo</td> <td>foo</td> <td>foo</td> </tr> 35 </table> 36 </body> 37 </html>
unfo posts on May 30, 2005 at 11:34
Very useful. thanks!
You need to create an account or log in to post comments to this site.
