abstract:<!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>
Correcting teacher:韦小宝Correction time:2019-01-21 16:10:47
Teacher's summary:写的很不错 这种小案例没事可以多练习几个 可以帮助我们快速的掌握js基础