jQuery框架+cookie选择样式表文件【转】

最新推荐文章于 2021-08-03 22:03:11 发布

iteye_5823

最新推荐文章于 2021-08-03 22:03:11 发布

阅读量66

点赞数

分类专栏： JavaScript+jquery+ajax 文章标签：框架 jQuery CSS C C++ ViewUI

本文链接：https://blog.csdn.net/iteye_5823/article/details/81971521

版权

JavaScript+jquery+ajax 专栏收录该内容

45 篇文章 0 订阅

订阅专栏

HTML:

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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>切换样式表title>
<script type="text/javascript" src="jquery.js">script>
<script type="text/javascript" src="switchStyle.js">script>
<link rel="stylesheet" type="text/css" href="style1.css" title="style1" />
<link rel="alternate stylesheet" type="text/css" href="style2.css" title="style2" />
<link rel="alternate stylesheet" type="text/css" href="style3.css" title="style3" />
head>

<body>
<h1>hello babyh1>
<a href="#" class="styles" rel="style1">style1a>
<a href="#" class="styles" rel="style2">style2a>
<a href="#" class="styles" rel="style3">style3a>
body>
html>

JS:

$( function (){
     $( ' .styles ' ).click( function ()
     {
         switchStyle( this .rel); // this.rel 取出当前元素属性rel的值,也可以使用id
         return false ;
     });
     var c = readCookie( ' style ' );
     if (c) switchStylestyle(c);
});

function switchStyle(styleName)
{
     $( ' link[@rel*=style][@title] ' ).each( function (i)     // 遍历link
     {
         this .disabled = true ;
         if ( this .title == styleName) this .disabled = false ;
     });
     createCookie( ' style ' ,styleName, 365 );
}

function createCookie(name,value,days){
     if (days)
     {
         var date = new Date();
         date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000 )); // 1000毫秒 getTime()取从1970.1.1到当前时间毫秒
         var expires = " ; expires= " + date.toGMTString();
     } else var expires = " " ;
     document.cookie = name + " = " + value + expires + " ; path=/ " ;
}

function readCookie(name){
     var nameEQ = name + " = " ;
     var ca = document.cookie.split( ' ; ' );
     for ( var i = 0 ;i < ca.length;i ++ ){
         var c = ca[i];
         while (c.charAt( 0 ) == " " ) c = c.substring( 1 ,c.length);    // charAt(0) 看C的0位置是什么，如果c不存在返回" "
         if (c.indexOf(nameEQ) == 0 ) return c.substring(nameEQ.length,c.length);
     }
     return null ;
}
function eraseCookie(name){
     createcokie(name, "" , - 1 )
}

css文件3个.
style1.css :
body{background:#CCCCCC;}
h1{color:red;}
style2.css :
body{background:#6699FF;}
h1{color:#336600;}
style3.css :
body{background:#CC99CC;}
h1{color:#FFFF00;}