1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
6 <title>练习</title>
7 <style type="text/css">
8 #box{width: 100px;height: 100px;border:1px solid #ccc;}
9 </style>
10 <script type="text/javascript">
11 function toWidth(){
12 document.getElementById(‘box‘).style.width=‘200px‘;
13 }
14 function toHight(){
15 document.getElementById(‘box‘).style.height=‘200px‘;
16 }
17 function toColor(){
18 document.getElementById(‘box‘).style.background=‘green‘;
19 }
20 function toHide(){
21 document.getElementById(‘box‘).style.display=‘none‘;
22 }
23 function toShow(){
24 document.getElementById(‘box‘).style.display=‘block‘;
25 }
26 function move(){
27 document.getElementById(‘box‘).style.marginLeft=‘300px‘;
28 }
29 </script>
30 </head>
31 <body>
32 <input type="button" value="变宽" onclick="toWidth();">
33 <input type="button" value="变高" onclick="toHight();">
34 <input type="button" value="变色" onclick="toColor();">
35 <input type="button" value="隐藏" onclick="toHide();">
36 <input type="button" value="显示" onclick="toShow();">
37 <input type="button" value="往右移动300px" onclick="move()">
38 <div id="box"></div>
39 </body>
40 </html>
如:css写法为margin-left:300px;但js写法为marginLeft
时间： 2024-11-11 04:40:23