javaScript事件的练习

原创 2018-10-20 18:20:19 228
摘要:<!DOCTYPE html> <html> <head>  <meta charset="UTF-8">  <title>Document</title>  <script type="text/javascript"&
<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>Document</title>
 <script type="text/javascript">
        var box
        window.onload=function() {
         box=document.getElementById("box");
        }
        function aa(){
         box.style.width="400px";
        }
        function bb(){
         box.style.height="200px";
        }
        function cc(){
         box.style.background="red";
        }
        function dd(){
         box.style.display="none";
        }
         function ee(){
         box.style.display="block";
        }
         function ff(){
         box.style.width="100px";
         box.style.height="100px";
         box.style.background="blue";
        }
 </script>
</head>
<body>
 <div id="box" style="width:100px;height:100px;background:blue;"></div>
 <input type="button" value="变宽" onclick="aa()">
 <input type="button" value="变高" onclick="bb()">
 <input type="button" value="变色" onclick="cc()">
 <input type="button" value="隐藏" onclick="dd()">
 <input type="button" value="显示" onclick="ee()">
 <input type="button" value="重置" onclick="ff()">
</body>
</html>


发布手记

热门词条