在javascript中用for循环做表格？

JavaScript010

在javascript中用for循环做表格？,第1张

//设置行，列

var cols=5 //5列

var rows=4//4行

var htmlstr="<table border='1px'>"

for(i=1i<=rowsi++){

htmlstr+="<tr>"

for(j=1j<=colsj++){

htmlstr+="<td >" + i +"行"+j+"列" +"</td>"

}

htmlstr+="</tr>"

}

htmlstr+="</table>"

document.write(htmlstr)

<scrpit type="text/javascript">

function table(num){

    var tab="<table>"

    for(var i=0i<=numi++){

        if(i%2==0){

            tab+="<tr><td class='red'></td><td class='red'></td><td class='red'></td><td class='red'></td><td class='red'></td><td class='red'></td><td class='red'></td><td class='red'></td><td class='red'></td><td class='red'></td></tr>"

        }else{

            tab+="<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>"

        }

    }

    tab+="</table>"

    document.write(tab)

}

table(10)

</script>

这样就可以了~然后你再去用CSS定义一下red的样式就可以了~

<table border="1">

    

</table>

<script type="text/javascript" src="jquery-1.8.3.min.js"></script>

<script type="text/javascript">

var arr = [1,2,3]

for(var i=1i<=arr.lengthi++){

if(i==arr[0]){

$("table").append("<tr><td rowspan='6'>1</td><td rowspan='2'>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr><tr><td>3</td><td>4</td><td>5</td><td>6</td></tr>")

}else if(i==arr[1]||i==arr[2]){

$("table").append('<tr><td rowspan="2">2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr><tr><td>3</td><td>4</td><td>5</td><td>6</td></tr>')

}

}

</script>