Heim > Artikel > Web-Frontend > So erzielen Sie einen Switch-Effekt in JS

So erzielen Sie einen Switch-Effekt in JS

php中世界最好的语言Original: 2018-04-18 11:22:283020Durchsuche

Dieses Mal zeige ich Ihnen, wie Sie den Switch-Effekt mit JS erzielen und welche Vorsichtsmaßnahmen es gibt, damit JS den Switch-Effekt erzielt. Schauen wir uns das an .

Die Verwendung von JavaScript zum Erzielen des Switch-Effekts ist ebenfalls ein Vorgang, auf den viele Menschen stoßen werden. Wenn Sie interessiert sind, werfen Sie einen Blick darauf.

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

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website.

Empfohlene Lektüre:

Das obige ist der detaillierte Inhalt vonSo erzielen Sie einen Switch-Effekt in JS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

php JavaScript JS

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：nodejs arbeitet als nächstes in ExpressNächster Artikel：nodejs arbeitet als nächstes in Express

In Verbindung stehende Artikel

Mehr sehen