视频案例0101

原创2019-08-19 11:40:0610
摘要:<!DOCTYPE html><html lang="en"><head>   <meta charset="UTF-8">   <meta name="viewport" content="width=device-width, in

<!DOCTYPE html>

<html lang="en">

<head>

   <meta charset="UTF-8">

   <meta name="viewport" content="width=device-width, initial-scale=1.0">

   <meta http-equiv="X-UA-Compatible" content="ie=edge">

   <title>Document</title>

   <style>

      #app{

          width: 100px;

          height: 100px;

          background: pink;

          margin: 20px 80px;

      }

   </style>

</head>

<body>

   <div id="app"></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()'>

   <script>


     var app

     window.onload=function(){

         app=document.getElementById('app')

     }

     function aa(){

         app.style.height='400px';

     }

     function bb(){

         app.style.width='400px';

     }

     function cc(){

         app.style.background='black';

     }

     function dd(){

         app.style.height='100px';

         app.style.width='100px';

         app.style.background='pink';

     }

     function ee(){

         app.style.display='none';

     }

     function ff(){

         app.style.display='block';

     }

   </script>

</body>

</html>


批改老师:Peter-Zhu批改时间:2019-08-20 10:23:59
老师总结:js可以省略语句结尾的分号, 如果你想省略,就全部省略, 风格统一

发布手记

热门词条

第九期线上培训班