JavaScript斑马线表格制作

Posted 2022-07-30 ooo888ooo

//实现斑马线表格

//方法1:
document.write(‘<table border="1">‘);

for(var i=1; i<11; i++)
    
    if(i % 2 ==0)
        document.write(‘<tr style="background-color:blue;color:#fff;">‘);
    else
        document.write(‘<tr style="background-color:yellow;color:green;">‘);
    
    
    for(var j=1; j<8; j++)
        document.write(‘<td>单元格‘ + j + ‘</td>‘);
    
    document.write(‘</tr>‘);


document.write(‘</table>‘);


//方法2:
var tableWp = ‘<table border="1">‘;

for(var i=0; i<10; i++)
    
    if(i % 2 != 0)
        tableWp += ‘<tr style="background-color:red;color:blue;">‘;
    else
        tableWp += ‘<tr style="background-color:blue;color:yellow">‘;
    
    
    for(var j=0; j<7; j++)
        tableWp += ‘<td>单元格‘ + j + ‘</td>‘;
    
    
    tableWp += ‘</tr>‘;


tableWp += ‘</table>‘;
document.write(tableWp);