JQuery+cookie网页换肤
现在介绍网页换肤的例子已经数不胜数，自己也没有仔细研究过，刚搞遇到类似这个问题，网上查了资料解决了问题，感觉很有用，就记录了下来和大家分享一下。效果很简单，我就直接讲怎么使用的。
其中用到了jquery.cookie.js，保存跟换的皮肤。
首先引入：
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript" src="jquery.cookie.js"></script> <link id="cssfile" type="text/css" href="skin_4.css" rel="Stylesheet">
html代码部分：
<div id="skin"> <span id="skin_0" title="蓝色" class="selected">蓝色</span> <span id="skin_1" title="紫色">紫色</span> <span id="skin_2" title="红色">红色</span> <span id="skin_3" title="天蓝色">天蓝色</span> <span id="skin_4" title="橙色">橙色</span> <span id="skin_5" title="淡绿色">淡绿色</span> </div>
JQuery代码部分：
//网站换肤
$(function () {
var $li = $("#skin span"); //查找到元素
$li.click(function () { //给元素添加事件
switchSkin(this.id);//调用函数
});
//保存Cookie完毕以后就可以通过Cookie来获取当前的皮肤了
var cookie_skin = $.cookie("MyCssSkin"); //获取Cookie的值
if (cookie_skin) { //如果确实存在Cookie
$("#cssfile").attr("href", cookie_skin + ".css"); //设置不同皮肤
}
});
function switchSkin(skinName) {
$("#" + skinName).addClass("selected") //当前<span>元素选中
.siblings().removeClass("selected"); //去掉其他同辈<span>元素的选中
$("#cssfile").attr("href", skinName + ".css"); //设置不同皮肤
$.cookie("MyCssSkin", skinName, { path: '/', expires: 10 }); //保存Cookie
}
最后在当前目录建立6个皮肤样式，命名为skin_0.css，skin_1.css，skin_2.css，skin_3.css，skin_4.css，skin_5.css，skin_6.css。