项目中有个一键切换皮肤的功能，感觉还不错，记录下，就是各颜色样式设置起来太复杂了，不知道有没有更简便的方法：
1、切换皮肤结构层
<li title="<s:text name='cems.skin'/>">
<a data-toggle="collapse" href="#colorPick"><img src="${basePath}/images/homePageicon/colorPick.png" /></a>
</li>
使用"Bootstrap 折叠（Collapse）插件"：下面网站可以详细学习
Bootstrap 折叠（Collapse）插件：http://www.runoob.com/bootstrap/bootstrap-collapse-plugin.html
2、切换皮肤表示层
3、切换皮肤行为层
$("#colorPick a").click(function(){
var oldcolor= $.cookie("color"); //获取cookie里存的color
var color=$(this).attr("data-skin"); //获取当前点击的元素的color，为属性data-skin的值
var len=$("#content-main .LRADMS_iframe").length; //获取iframe元素的个数
for(var i=; i<len;i++){
var obj= $("#content-main .LRADMS_iframe")[i].contentDocument.body; //循环获取各iframe里的body
$(obj).removeClass(oldcolor); //该body是修改各iframe里的body的样式
$(obj).addClass(color);
}
$.cookie("color", color); //设置cookie里的值为新值
$("body").removeClass(oldcolor); //该body是自身html里body的样式
$("body").addClass(color);
});
最后就是各颜色对应一套样式体系：
.skin-red .btn-default
{
color:#DD4B39;
}
.skin-yellow .btn-default
{
color:#F39C12;
}
.skin-blue .btn-primary:hover
{
background-color:#007AFF;
border:1px solid #007AFF;
color:#fff;
}
补充完善：
上面是一层iframe的情况，但是实际项目中还会碰到很多层iframe嵌套的情况，就像下面这样：
$("#colorPick a").click(function(){
var oldcolor= $.cookie("color");
var color=$(this).attr("data-skin");
var len=$("#content-main .LRADMS_iframe").length;
for(var i=; i<len;i++){
var obj= $("#content-main .LRADMS_iframe")[i].contentDocument.body;
$(obj).removeClass(oldcolor);
$(obj).addClass(color);
}
var len2=$(".layui-layer-iframe iframe").length;
for(var j=;j<len2;j++){
var obj= $(".layui-layer-iframe iframe")[j].contentDocument.body;
$(obj).removeClass(oldcolor);
$(obj).addClass(color);
var len3=$(".layui-layer-iframe iframe").contents().find("iframe").length;
for(var a=;a<len3;a++){
var obja= $(".layui-layer-iframe iframe").contents().find("iframe")[a].contentDocument.body;
$(obja).removeClass(oldcolor);
$(obja).addClass(color);
}
}
$.cookie("color", color);
$("body").removeClass(oldcolor);
$("body").addClass(color);
});
标红处为iframe嵌套时寻找下级iframe的方法
此外，如果是在iframe的页面使用 $.cookie() 方法是会报错$.cookie() is not a function的错误，原因是cookie在window下才有；
因此在iframe的页面需要使用 top.$.cookie() 才会获取到cookie值
//iframe页面使用top.$.cookie()
window.onload = function(){
var color = top.$.cookie("color");
$("body").addClass(color);
}