摘要：<!DOCTYPE html><style> #x{ width: 100px; height: 100px; background-color:red; }&l
<!DOCTYPE html>
<style>
#x{
width: 100px;
height: 100px;
background-color:red;
}
</style>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div id="x">
</div>
<button onclick="a()">變高</button>
<button onclick="b()">變寬</button>
<button onclick="c()">變色</button>
<button onclick="d()">重置</button>
<button onclick="e()">隱藏</button>
<button onclick="f()">顯示</button>
</body>
</html>
<script type="text/javascript">
var x = document.getElementById('x');
function a(){
x.style.height = "200px";
}
function b(){
x.style.width = "200px";
}
function c(){
x.style.backgroundColor = "pink";
}
function d(){
x.style.height = "100px";
x.style.width = "100px";
x.style.backgroundColor = "red";
}
function e(){
x.style.visibility = "hidden";
}
function f(){
x.style.visibility = "visible";
}
</script>
批改老師：韋小寶批改時間：2019-01-21 16:10:47
老師總結(jié)：寫的很不錯 這種小案例沒事可以多練習(xí)幾個 可以幫助我們快速的掌握js基礎(chǔ)