<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>上课安排</title>
<style type="text/css">
table{ border: 1px solid #FFFFFF}
th{background-color: royalblue; width: 80px; height: 60px;}
td{ width: 80px; height: 60px;}
button.dan{background-color:#aabbcc ; width: 80px; height: 60px; }
button.shuang{background-color:#D2E0E6 ; width: 80px; height: 60px; }
</style>
<script>
//头
document.write(\'<table id="myTable" > <thead>\'+
\'<tr>\'+
\'<th></th>\'+
\'<th scope="col">星期一</th>\'+
\' <th scope="col">星期二</th>\'+
\'<th scope="col">星期三</th>\'+
\'<th scope="col">星期四</th>\'+
\'<th scope="col">星期五</th>\'+
\'<th scope="col">星期六</th>\'+
\'<th scope="col">星期天</th>\'+
\'</tr>\'+
\'</thead>\');
var i= 1;//一天的课程安排,按照一天8节课计算
while (i<9)
{
document.write(
\'<tr>\'+
\'<th scope="row">第\'+ i +\'节课</th>\');
var j = 1;//星期一到星期天
while (j < 8)
{
//i代表第几节课,j代表星期几
if(i%2 == 0)
document.write( \'<td><button class="shuang">生物课</button></td>\');
else
document.write( \'<td><button class="dan">生物课</button></td>\');
j++;
}
document.write( \'</tr>\');
i++;
}
//尾
document.write(\'</table\');
</script>
</head>
<body>
</body>
</html>