How do I generate an empty HTML table (with alternating rows) via JavaScript?

J

Jeen_171

New member
Okay, I have to made a gigantic table w/ alternating row colors (defined by a class) in HTML. Now, I don't wanna manually copy+paste every <tr> and every <tr class="alt"> after each other. I'm trying to do this with JavaScript and I'm not 100% sure on the syntax on how to do this. The table I need generated is as follows:

<table>
<tbody>

<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>

<tr>
<td>...</td>
<td>...</td>
</tr>

<tr class="alt">
<td>...</td>
<td>...</td>
</tr>

<tr>
<td>...</td>
<td>...</td>
</tr>

...1200 more of these table rows...

</tbody>
</table>

I'm thinking the JavaScript should be as simple as:

document.write(' <table><tbody><tr><th>Header1</th><th>Header2</th></tr> ')
var i=0
for ( i=0; i <= 1200 ; i++){
if (i%2 !== 0){
document.write('<tr class="alt"><td></td><td></td></tr>')
}
else{
document.write('<tr><td></td><td></td></tr>')
}
}
document.write('</tbody></table>')

Is that it? I'm not good with JavaScript so I wanted to run it by before I tried it. Any help on this appreciated! Thanks.
 
Back
Top