方法步骤：
先获取要改变css的元素。
改变这个元素的style属性。
eg:下面是改变div的背景色,改为蓝色。
<style>
div{width:200pxheight:200pxbackground:#f00}
</style>
<div>改变背景色</div>
<script>
var div = document.getElementsByTagName("div")
div.style.background = "blue"
</script>
更改一个标签的 class 属性的代码是：document.getElementById( id ).className = 字符串
document.getElementById( id ) 用于获取标签对应的 DOM 对象，你也可以用其它方法获取。className 是 DOM 对象的一个属性，它对应于标签的 class 属性。字符串 是 class 属性的新值，它应该是一个已定义的CSS选择符。
class 属性是在标签上引用样式表的方法之一，它的值是一个样式表的选择符，如果改变了 class 属性的值，标签所引用的样式表也就更换了，所以这属于第一种修改方法。
利用这种办法可以把标签的CSS样式表替换成另外一个，也可以让一个没有应用CSS样式的标签应用指定的样式。
举例：
代码如下:
<style type="text/css">
.txt {
font-size: 30pxfont-weight: boldcolor: red
}
</style>
<div id="tt">欢迎光临！</div>
<p><button on click="setClass()">更改样式</button></p>
<script type="text/javas cript">
function setClass()
{
document.getElementById( "tt" ).className = "txt"
}
</script>
/* ======= FileName:skinCss.js =======* Author:Crystal (Feng Fupeng)
* Date:2008-02-24
* Email:8215349[at]qq.com
*/
function GetCookie(sName)
{
var aCookie = document.cookie.split("")
for (var i=0i <aCookie.lengthi++)
{
var aCrumb = aCookie[i].split("=")
if (sName == aCrumb[0])
{
return aCrumb[1]
}
}
return null
}
function SetCookie(name, value, time, domain)
{
var expdate = new Date()
var expires = time
if(expires!=null){
expdate.setTime(expdate.getTime() + ( expires * 1000 ))
expd = "expires="+expdate.toGMTString()+""
}else
expd = ""
if (domain)
{
domain = "domain="+ domain +"path=/"
}
document.cookie = name + "=" + escape (value) + "" + expd + domain
}
var cookieTag = "nd_skin"
var vSkin = GetCookie(cookieTag)
//皮肤撤销初始化皮肤
if(vSkin=="yx_subject0708"){setSkinColor('blue')}
function setSkinColor(vSkinNum)
{
SetCookie( cookieTag, vSkinNum, 60*60*24*30,"")
if(vSkinNum=="yx_subject0708"){vSkinNum="blue"}
document.getElementById("skinCss").href = "http://192.168.2.123/home/css/"+vSkinNum+".css"
}
if( vSkin &&vSkin!="Style" )
{
document.getElementById("skinCss").href = "http://192.168.2.123/home/css/"+vSkin+".css"
}
上面是JS里面代码,函数名字能看的懂吧,包含了换css的路径和初试输出还有cookie的记录,都包含在上面了,解释起来就很多了,相信你应该能看的明白
页面上html代码如下:
<link id="skinCss" href="http://172.21.13.133/KM_home/css/blue.css" rel="stylesheet" type="text/css" />
这个注意这个ID,你要换名字也可以,JS里面也要对应的换,至于放哪位置,就不必说了吧
然后还有一段就是你要换样式,那么一定要有触发事件
在body里面可以加上<ol>
<li><span class="skinPink" onclick="setSkinColor('pink')" title="粉红色">粉红</span></li>
<li><span class="skinBlue" onclick="setSkinColor('blue')" title="蓝色">蓝</span></li>
<li><span class="skinRed" onclick="setSkinColor('red')" title="红色">红</span></li>
<li><span class="skinGreen" onclick="setSkinColor('green')" title="绿色">绿</span></li>
<li><span class="skinPeagreen" onclick="setSkinColor('peagreen')" title="淡绿色">淡绿</span></li>
<li><span class="skinOrange" onclick="setSkinColor('orange')" title="橙色">橙</span></li>
<li><span class="skinPurple" onclick="setSkinColor('purple')" title="紫色">紫</span></li>
<li><a href=javascript:homePage()>设为首页</a></li>
</ol>
看的明白么,这是本人曾经做过的一个同功能的风格切换JS
测试就不用了,现在页面用的好好的,你看看满意么?
=============
你发给我的代码我看过了,我发了邮箱回复给你了,你看看
