Maison >interface Web >js tutoriel >Comment obtenir un effet de commutation dans JS

Comment obtenir un effet de commutation dans JS

php中世界最好的语言
php中世界最好的语言original
2018-04-18 11:22:283055parcourir

Cette fois, je vais vous montrer comment obtenir l'effet switch avec JS, et quelles sont les précautions pour que JS obtienne l'effet switch Voici un cas pratique, jetons un oeil. .

Utiliser JavaScript pour obtenir l'effet switch est également une opération que de nombreuses personnes rencontreront. Cet article vous donnera une brève introduction à la méthode. Si vous êtes intéressé, jetez-y un œil.

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

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :



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!

Déclaration:
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