サマリー:<!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>
添削の先生:查無此人添削時間:2019-05-10 14:14:09
先生のまとめ:完成的不錯。js非常強大,要多練習(xí)。繼續(xù)加油。