In diesem Artikel wird das Prinzip der Verarbeitung der JS -Seite Skinning -Funktion (* in einer Serverumgebung* verwendet werden*) für Ihre Referenz vorgestellt. Der spezifische Inhalt ist wie folgt
Prinzip:
1. Die Hautentfernung besteht darin, die Seite eine ungenutzte Stileinstellung zu verwenden
2. Wir erstellen mehrere Style -Blattdateien basierend auf dem Hautersatzbereich.
3. Holen Sie sich die Link -ID
4. Ändern Sie das HREF -Attribut des Link
5. Verwenden Sie das Stilblatt, ohne es zu verwenden. Verwenden Sie einfach den entsprechenden Hautstil
6. Wenn Sie das Benutzerprinzip der Verwendung von Cookie -Technologie verwenden, verwenden Benutzer auch die letzte Hautauswahl
7. Das Lesen von Cookies muss auf der Seite geladen werden, um sicherzustellen, dass das entsprechende Haut -CSS im Voraus geladen wird
<html> <kopf> <titels> JS-Seite Skinning-Funktion </title> <meta charset = "utf-8"> <link href = "public.css" rel = "styleSheet" type = "text/CSS"/> <link href = "1.css" rel = "stylesheet" type "text/text/cs /*JS -Seite Skinning -Funktion Processing Prinzip 1. Hautersatz soll die Seite ohne Style -Einstellungen einstellen. 2. Wir erstellen den Ort, der in mehreren Stilblattdateien entsprechend der Haut ersetzt werden kann. Auswahl 7. Lesen Sie das Cookie zu Beginn des Ladenladens und stellen Sie sicher, dass das entsprechende Haut -CSS im Voraus geladen wird var Skipval = Readcookie ("Haut"); if (! Skipval) {// Wenn das Cookie keine Aufzeichnung über Skin hat. var Skin2 = document.getElementById ("Skin2"); var Skin3 = document.getElementById ("Skin3"); var tage = 30; // die Ablaufzeit festlegen, var exp = neues Datum (); exp.settime (exp.getTime () + days*24*60*60*1000); Skin1.onclick = function () {Skin.href = "1.css"; document.cookie = "Skin = 1; expires ="+exp.toutcstring (); }; Skin2.Onclick = function () {Skin.href = "2.css"; document.cookie = "Skin = 2; expires ="+exp.toutcstring (); }; Skin3.Onclick = function () {Skin.href = "3.css"; document.cookie = "Skin = 3; expires ="+exp.toutcstring (); };}; // Lesen Sie den angegebenen Wert der Cookie -Funktion Readcookie (Schlüssel) {var SkinVal = false; var arrkv = cookieval.Split (";"); für (var i = 0; i <arrkv.length; i ++) {var itemc = arrkv [i] .Split ("="); if (itemc [0] == key) {SkinVal = itemc [1]; }anders{ }; }; return skinval;};</script></head><body><div> <div> <input type="button" value="skin1" id="skin1" /> <input type="button" value="skin2" id="skin2" /> <input type="button" value="skin3" id="skin3" /> </div></div><div> <div>I am content1</div> <div>I am content2 </div> <div> Ich bin content3 </div> </div> <div> Ich bin Schwanzinformation </div> </body> </html>Quellcode herunterladen: http://xiazai.vevb.com/201607/yuanma/jschangeskin(vevb.com).rar
Das obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, es wird für das Lernen aller hilfreich sein und ich hoffe, jeder wird Wulin.com mehr unterstützen.