摘要：<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0">&
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<button onclick="f1(this)">變高</button>
<button onclick="f2(this)">變寬</button>
<button onclick="f3(this)">變色</button>
<button onclick="f4(this)">重置</button>
<button onclick="f5(this)">隱藏</button>
<button onclick="f6(this)">顯示</button>
<div id="box" style="width:100px;height:100px;background-color:blue;margin:50px 100px;"></div>
<script>
var btn=document.getElementById('box');
function f1(){btn.style.height="200px"; }
function f2(){btn.style.width="200px"; }
function f3(){btn.style.background="red"; }
function f4(){btn.style.height="100px";btn.style.width="100px";btn.style.background="blue";}
function f5(){btn.style.display="none"; }
function f6(){btn.style.display="block"; }
</script>
</body>
</html>
批改老師：天蓬老師批改時(shí)間：2019-01-28 14:38:53
老師總結(jié)：function f1(){btn.style.height="200px"; }如果只有一行代碼,不如直接寫(xiě)到html屬性中