Java WEB中基于jQuey 的换肤实现

      随着个性化社会的发展，现在很多软件都支持换肤功能，允许用户来定制软件的外观，那么JavaWeb软件开发是如何实现换肤的呢？请跟随小编一起走进换肤实现

换肤的实现原理：动态改变需要的css文件。

实现方式：

一、CSS设置部分:
每种风格设置一个套样式表，分别放在不同的文件夹中，最好CSS样式表中用到的背景图片等也放在该文件夹下， 把文件夹地址作为系统环境变量。

   通常,需要写一个网站通用的CSS文件,该文件一般只控制css的位置布局,不涉及颜色,背景布局，然后每套风格只涉及换肤方案的css文件,这里就只控制颜色,背景。

页面使用部分:

需要使用系统变量来读取样式表和图片文件
Java代码 

1. <link rel="stylesheet" href="jquery-easyui-1.3.3/themes/default/easyui.css" type="text/css"></link>
2. <link rel="stylesheet" href="jquery-easyui-1.3.3/themes/icon.css" type="text/css"></l

href 是链接到css的控件的背景和颜色文件

  
变量的设置和读取:
设置事件：
function change(type)
   {
       if(type == "black")
     {
          document.getElementById("myCss").href="jquery-easyui-1.3.3/themes/black/easyui.css";
     }
     if(type == "gray")
    {
         document.getElementById("myCss").href="jquery-easyui-1.3.3/themes/gray/easyui.css";
    }
    if(type == "blue")
    {
        document.getElementById("myCss").href="jquery-easyui-1.3.3/themes/default/easyui.css";
    }
    return ;
  }

读取：
 <div id="menuHuanFuGuanLi" style="width:60px;">
         <div><a href="#" style="text-decoration: none;color:black;" οnclick="change('black')">黑色经典</a></div>
         <div><a href="#" style="text-decoration: none;color:black"  οnclick="change('gray')">灰色畅想</a></div>
         <div><a href="#" style="text-decoration: none;color:black"  οnclick="change('blue')">蓝色海洋</a></div>
 </div>
那么这个简单的换肤就实现了，但是假如要实现整个浏览全过程的话，就要把css存在cookie中，每次从cookie中读取css文件，那么就实现我们的换肤功能啦,