欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

js开关灯小应用

程序员文章站 2022-03-03 16:05:42
...


js中判断的应用【开关灯】


<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>开关灯</title>
        <style type="text/css">
            html, body {            
            margin: 0px;            
            padding: 0px;            
            width: 100%;            
            height: 100%;            
            cursor: pointer;            
            background-color: white;        }
        </style>
    </head>                
      <body id="bodyEle">
        <script type="text/javascript">
        var oBody = document.getElementById("bodyEle");
        oBody.onclick = function () {
            var bg = this.style.backgroundColor;        
            switch (bg) {            
            case "white":                
            this.style.backgroundColor = "red";                
            break;            
            case "red":                
            this.style.backgroundColor = "black";                
            break;            
            default:                
            this.style.backgroundColor = "white";
            }
        }
       </script>
     </body>
</html>

以上就是js开关灯小应用的详细内容,更多请关注其它相关文章!