Cet article présente le principe de traitement de la fonction de skinning de la page JS (* doit être testé et utilisé dans un environnement de serveur *) pour votre référence. Le contenu spécifique est le suivant
principe:
1. Le retrait de la peau est de faire en sorte que la page utilise un paramètre de style inutilisé
2. Nous fabriquons des fichiers de feuilles de style multiple basés sur la zone de remplacement de la peau.
3. Obtenez l'ID de lien
4. Modifiez l'attribut HREF du lien pour modifier la feuille de style
5. Utilisez la feuille de style sans l'utiliser, utilisez simplement le style de peau correspondant
6. Utilisant le principe de l'utilisateur de l'utilisation de la technologie des cookies, les utilisateurs utiliseront également la dernière sélection de la peau
7. La lecture des cookies doit commencer à se charger sur la page pour s'assurer que le CSS de la peau correspondante est chargé à l'avance
<html><head><title>js page skinning function</title><meta charset="utf-8"><link href="public.css" rel="stylesheet" type="text/css" /><link href="1.css" rel="stylesheet" type="text/css" id="skin" /><script type="text/javascript"> / * JS Page Skinning Fonction Processing Principle 1. Le remplacement de la peau est de définir la page sans utiliser les paramètres de style 2. Nous faisons l'endroit à remplacer en fichiers de feuilles de style multiple en fonction de la peau sans l'utiliser 3. Obtenez l'ID du lien 4. Modifier l'attribut HREF du lien pour modifier la feuille de style 5. Sélection 7. Lisez le cookie au début du chargement de la page, en vous assurant que le CSS de la peau correspondante est chargé à l'avance * / // Lisez le cookie, et la peau modifie la peau var = document.getElementById ("Skin"); // Obtenez l'élément de liaison var Cookieval = Document.cookie; var skipval = Readcookie ("peau"); if (! skipval) {// Si le cookie n'a pas d'enregistrement skin.href = "1.css";} else {skin.href = skipval + ". css"; // il y a des enregistrements}; window.onLoad = function () {// cliquez sur le bouton pour remplacer la peau var skin1 = document.getElementyId ("skin1"); var skin2 = document.getElementById ("skin2"); var skin3 = document.getElementById ("skin3"); var jours = 30; // définit l'heure d'expiration, var exp = new Date (); exp.setTime (exp.getTime () + jours * 24 * 60 * 60 * 1000); skin1.onclick = function () {skin.href = "1.css"; document.cookie = "skin = 1; exires =" + exp.toutcstring (); }; Skin2.OnClick = fonction () {skin.href = "2.css"; document.cookie = "skin = 2; exires =" + exp.toutcstring (); }; skin3.OnClick = function () {skin.href = "3.css"; document.cookie = "skin = 3; exires =" + exp.toutcstring (); };}; // Lire la valeur spécifiée de la fonction cookie Readcookie (key) {var skinVal = false; var arrkv = Cookieval.split (";"); for (var i = 0; i <arrkv.length; i ++) {var itemc = arrkv [i] .split ("="); if (itemc [0] == key) {skinVal = itemc [1]; }autre{ }; }; return skinval;}; </ script> </ head> <body> <div> <div> <entrée type = "Button" value = "skin1" id = "skin1" /> <input type = "Button" value = "skin2" id = "skin2" /> <entrée = "Button" value = "skin3" id = "skin3" /> </v> </v> <v> <v> <v> <v> </v> <v> <div> <v> </v> <v> <v> Content2 </div> <div> Je suis Content3 </div> </div> <div> Je suis des informations de la queue </div> </body> </html>Téléchargement du code source: http://xiazai.vevb.com/201607/yuanma/jschangeskin(vevb.com).rar
Ce qui précède est tout le contenu de cet article. J'espère que cela sera utile à l'apprentissage de tous et j'espère que tout le monde soutiendra davantage Wulin.com.