JavaScript实现开关等效果

  • 2022-11-24 23:46:49

废话不多说了,直接给大家贴代码了,具体代码如下所示:

<!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>

总结

以上所述是小编给大家介绍的javascript实现开关等效果,希望对大家有所帮助

猜你喜欢