您的位置:首页 > 运维架构 > 网站架构

JS控制网站样式改变的原理

2015-10-03 16:54 405 查看
网站样式改变是随着样式表改变而改变的,所以整个网站的样式改变仅需要改变风格css文件即可。通常静态网站改改变样式方法如下:

function shiftStyle(){
if(db_shiftstyle == 1){
if (getObj('widthCfg').innerHTML=='切换到宽版') {
if(!getObj('fullscreenStyle')) {
var l = document.createElement('link');
l.id="fullscreenStyle";
l.rel="stylesheet";
l.type="text/css";
l.href="images/fullscreen.css";
l.media="all";
document.body.appendChild(l);
}else {
getObj('fullscreenStyle').disabled = false;
}
getObj('widthCfg').innerHTML='切换到窄版';
var widthCfg = 1;
} else {
var widthCfg = 0;
getObj('fullscreenStyle').disabled=true;
getObj('widthCfg').innerHTML='切换到宽版';
}
SetCookie('widthCfg',widthCfg);
if(typeof goTop!="undefined"){
goTop.setStyle();
}
if(typeof messagetip!="undefined"&&typeof messagetip.db!="undefined"){
messagetip.setStyle();
messagetip.update();
}
}
};


  

另外,改变了网站样式表之后,一定要处理原来和现在的样式表关系。

处理方法如下:

1. 检查网页cookie中有没有更改过的样式表痕迹

2. 根据更改过的痕迹选择css文件路径

3. 加载css文件路径

各位大神请指教,以上方法也仅是小弟的一面之词,望有更好的方法。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: