摘要：跟著老師做，一個(gè)是沒(méi)有問(wèn)題的！突然想到這種案例特別適合做循環(huán)就試了一下，遇到了很大困難，baidu解決了！<!DOCTYPE html><html><head><meta charset="utf-8" /><meta http-equiv="X-UA-Compatible" content="
跟著老師做，一個(gè)是沒(méi)有問(wèn)題的！
突然想到這種案例特別適合做循環(huán)就試了一下，遇到了很大困難，baidu解決了！
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style >
#boxs{
width: 100px;
height: 100px;
background: #f5f;
margin: 20px 80px;
}
</style>
</head>
<body>
<div id="boxs"></div>
<input type="button" value="變高" onclick="checkset(this,1)">
<input type="button" value="變寬" onclick="checkset(this,2)" >
<input type="button" value="變色" onclick="checkset(this,3)" >
<input type="button" value="重置" onclick="checkset(this,4)" >
<input type="button" value="隱藏" onclick="checkset(this,5)" >
<input type="button" value="顯示" onclick="checkset(this,6)" >
<script type="text/javascript">
function checkset(vla,x){
var boxs = document.getElementById("boxs").style;
switch(x){
case 1:
boxs.height="200px";
break;
case 2:
boxs.width="200px";
break;
case 3:
boxs.background="red";
break;
case 4:
boxs.height="100px";
boxs.width="100px";
boxs.background="#f5f";
break;
case 5:
boxs.display='none';
break;
case 6:
boxs.display='block';
break;
default:
;
}
}
</script>
</body>
</html>
批改老師：天蓬老師批改時(shí)間：2019-01-27 08:59:58
老師總結(jié)：用switch 是一個(gè)不錯(cuò)的思路 , 不錯(cuò)