当前位置: 移动技术网 > IT编程>开发语言>JavaScript > JavaScript实现开关等效果

JavaScript实现开关等效果

2017年12月12日  | 移动技术网IT编程  | 我要评论
废话不多说了,直接给大家贴代码了,具体代码如下所示: <!doctype html> <html> <head> &l

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

<!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实现开关等效果,希望对大家有所帮助

如您对本文有疑问或者有任何想说的,请 点击进行留言回复,万千网友为您解惑!

相关文章:

验证码:
移动技术网