Alternate Row Shading On Table

• Tweet
• 

<script>
	function init () {
		var tables = document.getElementsByTagName("table");
		for(var i = 0; i < tables.length; i++) {
			if(tables[i].className.match(/zebra/)) {
				zebra(tables[i]);
			}
		}
	}

	function zebra (table) {
		var current = "oddRow";
		var trs = table.getElementsByTagName("tr");
		for(var i = 0; i < trs.length; i++) {
			trs[i].className += " " + current;
			current = current == "evenRow" ? "oddRow" : "evenRow";
		}
	}
</script>
<style>
	tr.oddRow { background-color:#EEEEEE; }
	tr.evenRow { background-color:#FFFFFF; }
</style>

<!-- INSERT TABLE HERE -->
<!-- Must make class of table 'zebra' -->

<script>
	init(); // Or can do a body onLoad="init();"
</script>

Tags:
• html
• javascript