Thursday, January 7, 2010

Alternate Table Rows Color

Let's start with an ordinary html table. Whether the table contains head/foot elements doesn't matter in this case:
0 - some txt
1 - some txt
 
2 - some txt
 
3 - some txt
 
4 - some txt
     

Now, we need to check that the browser is fairly new and has the necessary JavaScript capabilities (i.e. W3C DOM support). The following line performs this check, disqualifying Netscape 4 and others of that generation. Such browsers will make no attempt to color the table.
if(document.getElementById)
Also note that common to all these examples is this code:
var table = document.getElementById(id);  
var rows = table.getElementsByTagName("tr");  
for(i = 0; i < rows.length; i++){          
   //manipulate rows
     ...

Example 1

blogger templates | Make Money Online