Verwenden von js zum Implementieren eines einfachen Lichtschaltercodes

Verwenden von js zum Implementieren eines einfachen Lichtschaltercodes

Körperteil:

<button>Licht ein-/ausschalten</button>

Skriptteil:

    <Skript>

        // window.onload ist das Fensterladeereignis, mit dem Code in das Element geschrieben werden kann window.addEventListener('load', function () {

            var btn = document.querySelector('Schaltfläche');

            // Definieren Sie eine Variable, um zu bestimmen, ob das Licht an oder aus ist. var flag = 0;

            btn.onclick = Funktion () {

                wenn (Flagge == 0) {

                    document.body.style.backgroundColor = "schwarz";

                    Flagge = 1;

                } anders {

                    Dokument.Body.Style.BackgroundColor = "pink";

                    Flagge = 0;

                }

            }

        })

    </Skript>

Wenn script direkt unter button geschrieben wird,

Verwenden Sie dann den folgenden Code:

<Skript>

        var btn = document.querySelector('Schaltfläche');

        Var-Flagge = 0;

        btn.onclick = Funktion () {

            wenn (Flagge == 0) {

                document.body.style.backgroundColor = "schwarz";

                Flagge = 1;

            } anders {

                Dokument.Body.Style.BackgroundColor = "pink";

                Flagge = 0;

            }

        }

    </Skript>
 

Dies ist das Ende dieses Artikels über die Verwendung von JS zur Implementierung von einfachem Lichtschaltercode. Weitere relevante Inhalte zu JS zur Implementierung von einfachem Lichtschalter finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird!

Das könnte Sie auch interessieren:
  • js, um den Effekt des Lichtschaltens zu erzielen
  • Beispiel für das Umschalten einer Glühbirne durch Klicken auf einen mit JavaScript implementierten Spezialeffekt
  • JS/jQuery zum Erreichen eines einfachen Lichtschaltereffekts [Fall]

<<:  Erläutern Sie die Bereitstellung und Konfiguration des Clickhouse Docker-Clusters anhand von Beispielen.

>>:  Zusammenfassung eines CSS-Codes, der die gesamte Site grau macht

Artikel empfehlen

Optimierung des MySQL Thread_Stack-Verbindungsthreads

MySQL kann nicht nur über das Netzwerk, sondern a...

Next.js – Erste Schritte-Tutorial

Inhaltsverzeichnis Einführung Erstellen eines Nex...

Eine kurze Analyse der Probleme mit JS-Originalwerten und Referenzwerten

Primitive Werte -> primitive Typen Number Stri...

Verwenden Sie thead, tfoot und tbody, um eine Tabelle zu erstellen

Manche Leute verwenden diese drei Tags auf pervers...

Fähigkeiten zur Seiten-Refaktorierung – Javascript, CSS

Über JS, CSS CSS: Stylesheet oben Vermeiden Sie C...

Implementierungsprinzip der MySQL MyISAM-Standardspeicher-Engine

Standardmäßig generiert die MyISAM-Tabelle drei D...

Detailliertes Beispiel für MySQL ähnlich dem Schreiben von Oracle Rownum

Rownum ist eine einzigartige Schreibmethode in Or...

JS-Version des Bildlupeneffekts

In diesem Artikel wird der spezifische JS-Code zu...

Zusammenfassung der benutzerdefinierten JavaScript-Objektmethoden

Inhaltsverzeichnis 1. Verwenden Sie Objekt, um ei...

HTML-Grammatik-Enzyklopädie_HTML-Sprachgrammatik-Enzyklopädie (unbedingt lesen)

Datenträgerbezeichnung, Eigenschaftsname, Beschre...

Lehr- oder Lernprogramm für Webdesign

Abschnitt Studieninhalte Std 1 Webdesign-Übersich...

JavaScript-Wissen: Konstruktoren sind auch Funktionen

Inhaltsverzeichnis 1. Definition und Aufruf des K...