In diesem Artikel wird die JavaScript -Methode beschrieben, um den Hintergrund und die Schriftfarbe der Webseite zu ändern. Teilen Sie es für Ihre Referenz. Die spezifische Analyse ist wie folgt:
JavaScript, indem Sie auf die Schaltfläche klicken, um die Farbe des Webseitenhintergrunds und der Schriftart zu ändern. Es gibt N -Schaltflächen, um die Farbe auf der Webseite zu ändern. Wenn Sie auf verschiedene Schaltflächen klicken, werden die Schriftart und der Hintergrund der Webseite in verschiedene Farben geändert. Sehr einfaches JavaScript -Applet.
1. Grundziele
Sobald Sie die Webseite öffnen, fordern Sie zunächst die Begrüßungsnachricht "Hallo" auf
Es gibt N -Schaltflächen, um die Farbe auf der Webseite zu ändern, wobei die Rückgabe die Standardfarbe der Webseite ist, der Hintergrund weiß und die Schriftart schwarz ist.
Klicken Sie auf verschiedene Schaltflächen, und die Schriftart und der Hintergrund der Webseite ändern sich in verschiedenen Farben.
Ich wollte ursprünglich eine Regenbogenverbesserung vornehmen, aber das Prinzip ist genau das gleiche, also werde ich nicht mehr Schaltflächen schreiben.
2. Grundlegende Ideen
Der Schlüssel besteht darin, IDs für Körper Tags und Schriftarten JS bereitzustellen, damit sie in JS kontrolliert werden können. Dieses Beispiel bietet eine Anwendung auf JS -Funktionen.
3. Produktionsprozess
Nur eine einfache kleine Seite. Weitere Informationen finden Sie in den Kommentaren:
Kopieren Sie den Code wie folgt: <! DocType html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<kopf>
<meta http-äquiv = "content-type" content = "text /html; charset = gb2312" />
<title> js ändern die Hintergrundfarbe </title>
<!-Dieser Absatz kann auch in eine JS-Datei unterteilt werden, aber dieser Code ist zu kurz, so dass es keine Notwendigkeit gibt->
<script type = "text/javaScript">
// Onload entspricht dem Konstruktor dieser Webseite, und Onunload entspricht der Disjunktion der Funktion dieser Webseite
Funktion load () {
alarm ("Hallo!");
}
Funktion entlade () {
Alarm ("Auf Wiedersehen!");
}
FUNKTION ARCHECOLOR (BCOLOR, FCOLOR) {
// Äquivalent zum Ändern der Farbe der Schriftart für die Schrift <span style = "Farbe: übergebene FColor">
document.getElementById ("body"). style.background = bcolor;
document.getElementById ("ziti"). style.color = fcolor;
}
</script>
</head>
<!-Der Schlüssel ist, eine ID für die gesamte Webseite und die Zeilenschriften bereitzustellen. Die GetElementById () -Methode in JS kann die Dinge in CSS leicht steuern->
<body onload = "load ()" onunload = "entlade ()" id = "body">
<span id = "ziti"> js </span>
<br />
<!-Beachten Sie, dass bei der Übergabe von Parametern in doppelten Zitaten die ursprünglichen Doppelzitate zu Einzelzitaten werden. Der Wert von Onclick wird etwas ausgelöst, sobald diese Schaltfläche geklickt wird.
<Eingabe onclick = "ChangeColor ('#ff0000', '#ffffff')" Typ = "Taste"
value = "rot" />
<Eingabe onclick = "ChangeColor ('#ff9900', '#ffffff')" Typ = "Taste"
value = "orange" />
<Eingabe onclick = "ChangeColor ('#ffff00', '#000000')" Typ = "Taste"
value = "gelb" />
...
<Eingabe onclick = "ChangeColor ('#ffffff', '#000000')" Typ = "Taste"
value = "return" />
</body>
</html>
Die Funktion onunload () ist fast nur gültig, wenn der IE diese Seite schließt. Dieses Dialogfeld befindet sich nicht im vorderen Ende, und Google Chrome hat keinen Einfluss. Daher hat diese Funktion wenig Bedeutung.
Freunde, die sich für JS -Farbbetriebsfähigkeiten interessieren, können sich auch auf das Online -Tool beziehen:
RGB -Farbkodiergenerator
Online -Web -Farb -Matching -Tool
RGB Farbabfrage Vergleich Tabelle_Color Code Tabelle_Colour English Name Collection
Ich hoffe, dieser Artikel wird für JavaScript -Programme aller hilfreich sein.