Este artigo apresenta o princípio do processamento da função de pele da página JS (* precisa ser testado e usado em um ambiente de servidor*) para sua referência. O conteúdo específico é o seguinte
princípio:
1. A remoção da pele é fazer a página usar uma configuração de estilo não utilizada
2. Fazemos vários arquivos de folha de estilo com base na área de reposição da pele.
3. Obtenha o ID do link
4. Modifique o atributo href do link para alterar a folha de estilo
5. Use a folha de estilo sem usá -la, basta usar o estilo de pele correspondente
6. Usando o princípio do usuário de usar a tecnologia de cookies, os usuários também usarão a última seleção de pele
7. Os cookies de leitura devem começar a carregar na página para garantir que o CSS da pele correspondente seja carregado com antecedência
<html> <head> <title> JS Página Skinning Função </ititle> <meta charset = "utf-8"> <link href = "public.css" rel = "stylesheet" type = "text/csS"/> <link href = "1.css" Rel = "Stylesheet" tipo = "/cs/css" idf "=" Rel = "Stylesheet" tipo = "/css"/css "/css") /*JS Page Skinning Função Processamento Princípio 1. A substituição da pele é definir a página sem usar as configurações de estilo 2. Fazemos o local a ser substituído em arquivos de vários estilos de acordo com a pele sem usá -lo 3. Obtenha o ID do link 4. Modificar o atributo href do link para alterar a lençol 5. Seleção 7. Leia o cookie no início do carregamento da página, garantindo que o CSS da pele correspondente seja carregado com antecedência */// leia o cookie e a troca de pele var skin = document.getElementById ("skin"); // obtenha o elemento de link var cookieval = document.cookie; var skipval = readcookie ("pele"); if (! skipval) {// se o cookie não tiver gravar skin.href = "1.css";} else {skin.href = skipval+". css"; // existe registros}; window.onload = function () {// clique no botão para substituir a pele var skin1 = document.onementbyId ("Skin1); var skin2 = document.getElementById ("skin2"); var skin3 = document.getElementById ("skin3"); var dias = 30; // Defina o tempo de expiração, var exp = new Date (); Exp.setTime (exp.getTime () + dias*24*60*60*1000); Skin1.OnClick = function () {skin.href = "1.css"; document.cookie = "skin = 1; expire ="+exp.ToutcString (); }; Skin2.OnClick = function () {skin.href = "2.css"; document.cookie = "skin = 2; expire ="+exp.ToutcString (); }; skin3.OnClick = function () {skin.href = "3.css"; document.cookie = "skin = 3; expire ="+exp.ToutcString (); };}; // Leia o valor especificado da função 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]; }outro{ }; }; Retorne a pele de pele;}; </sCript> </ad Head> <body> <div> <div> <input type = "button" value = "skin1" id = "skin1"/> <input type = "button" value = "skin2" iD = "Skin2"/> <input Type = "" "=" Skin3 "id =" Skin3 "/> </> </> </> Content2 </div> <div> Eu sou content3 </div> </div> <div> Eu sou informações da cauda </div> </body> </html>Download do código -fonte: http://xiazai.vevb.com/201607/yuanma/jschangeskin(vevb.com).rar
O exposto acima é todo o conteúdo deste artigo. Espero que seja útil para o aprendizado de todos e espero que todos apoiem mais o wulin.com.