Maison > interface Web > js tutoriel > le corps du texte

Partage de code pour réaliser un effet de commutation à l'aide de JavaScript

巴扎黑
Libérer: 2017-09-09 09:57:29
original
2213 Les gens l'ont consulté

Cet article partagera avec vous un code simple pour obtenir l'effet d'allumer et d'éteindre la lumière basé sur js. Le code est simple et facile à comprendre, très bon et a une valeur de référence. Les amis qui en ont besoin peuvent s'y référer. à cela

Fin de bêtises, je posterai le code directement pour vous. Le code spécifique est le suivant :


<!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>
Copier après la connexion
.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal