abstrakt：<!DOCTYPE html> <html> <head> <title>javascript控制DIV樣式</title> <style type="text/css"> #box{ width: 100px; height: 100px;
<!DOCTYPE html>
<html>
<head>
<title>javascript控制DIV樣式</title>
<style type="text/css">
#box{
width: 100px;
height: 100px;
background:red;
margin: 20px 80px;
}
</style>
</head>
<body>
<script type="text/javascript">
var box;
window.onload = function(){
box = document.getElementById('box');
}
function aa(){
box.style.height = '400px'; // 改變高度
}
function bb(){
box.style.width = '400px'; // 改變寬度
}
function cc(){
box.style.background = 'pink'; // 改變顏色
}
function dd(){
box.style.height = '100px';
box.style.width = '100px'; // 重置
box.style.background = 'red';
}
function ee(){ // 隱藏
box.style.display = 'none';
}
function ff(){ // 顯示
box.style.display = 'block';
}
</script>
<input type="button" onclick="aa()" value="變高">
<input type="button" onclick="bb()" value="變寬">
<input type="button" onclick="cc()" value="變色">
<input type="button" onclick="dd()" value="重置">
<input type="button" onclick="ee()" value="隱藏">
<input type="button" onclick="ff()" value="顯示">
<div id="box"></div>
</body>
</html>
Korrigierender Lehrer：查無此人Korrekturzeit：2019-05-10 14:14:09
Zusammenfassung des Lehrers：完成的不錯(cuò)。js非常強(qiáng)大，要多練習(xí)。繼續(xù)加油。