简单网页-----课程表
1.效果图
2.具体代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Class</title>
<style type="text/css">
table{
border: 1px solid ;
}
td{
text-align: center;
width: 100px;
height: 30px;
}
</style>
</head>
<body>
<h1>课程表</h1>
<br /><br />
<input type="text" id="numb" placeholder="请输入所要查询的周数"/>
<button onclick="myFunction()">查询</button>
<p id="demo"></p>
<table>
<tr>
<td>周一</td>
<td>周二</td>
<td>周三</td>
<td>周四</td>
<td>周五</td>
<td>周六</td>
<td>周日</td>
</tr>
<tr>
<td id="1"></td>
<td id="5"></td>
<td id="9"></td>
<td id="13"></td>
<td id="17"></td>
<td id="21"></td>
<td id="25"></td>
</tr>
<tr>
<td id="2"></td>
<td id="6"></td>
<td id="10"></td>
<td id="14"></td>
<td id="18"></td>
<td id="22"></td>
<td id="26"></td>
</tr>
<tr>
<td id="3"></td>
<td id="7"></td>
<td id="11"></td>
<td id="15"></td>
<td id="19"></td>
<td id="23"></td>
<td id="27"></td>
</tr>
<tr>
<td id="4"></td>
<td id="8"></td>
<td id="12"></td>
<td id="16"></td>
<td id="20"></td>
<td id="24"></td>
<td id="28"></td>
</tr>
</table>
<script>
function myFunction()
{
var shu_ju_jie_gou = "数据结构";
var computer_internet = "计算机网络";
var dan_pian_ji = "单片机原理及应用";
var English = "大学英语";
var Math_1 = "线性代数";
var P_E = "体育";
var shu_zi_dian_lu = "数字电路技术基础";
var Art = "美术鉴赏";
var is_true = true ;
var Week = document.getElementById("numb").value;
while(is_true)
{
if(Week >=1 && Week<=18)
is_true = false;
for(var i = 1; i <= 7 ; i++)
{
if(i==1)
{
if(Week >= 2 && Week<=18)
document.getElementById("1").innerHTML = shu_ju_jie_gou;
if(Week >= 2 && Week<=18)
document.getElementById("2").innerHTML = computer_internet;
if(Week >= 1 && Week<=18)
document.getElementById("3").innerHTML = dan_pian_ji;
if(Week >= 1 && Week<=18)
document.getElementById("4").innerHTML = P_E;
}
if(i==2)
{
if(Week >= 1 && Week<=18)
document.getElementById("5").innerHTML = computer_internet;
if(Week >= 1 && Week<=18)
document.getElementById("6").innerHTML = English;
if(Week >= 1 && Week<=18 && Week%2==0)
document.getElementById("7").innerHTML = Math_1;
else{document.getElementById("7").innerHTML = shu_ju_jie_gou;}
}
if(i==3)
{
if(Week >= 1 && Week<=18)
document.getElementById("9").innerHTML = Math_1;
if(Week >= 4 && Week<=14 && Week%2==0)
document.getElementById("10").innerHTML = shu_zi_dian_lu;
}
if(i==4)
{
if(Week >= 2 && Week<=18)
document.getElementById("13").innerHTML = dan_pian_ji;
if(Week >= 2 && Week<=18)
document.getElementById("14").innerHTML = shu_zi_dian_lu;
}
if(i==5)
{
if(Week >= 1 && Week<=18)
document.getElementById("17").innerHTML = English;
if(Week >= 1 && Week<=18)
document.getElementById("19").innerHTML = shu_ju_jie_gou;
}
if(i==6)
{
if(Week >= 2 && Week<=18)
document.getElementById("22").innerHTML = Art;
}
}
}
}
</script>
</body>
</html>