js 实现换肤
js换肤
可以通过js来实现网页换肤效果的两种方案,很简单。
展示~
简单换肤: 普通的CSS样式更换即可实现
方案1:js动态的link对应的皮肤样式
过编译工具与构建工具编译出多套皮肤css,通过js动态的link对应的皮肤样式
// js动态处理
var theme = /\bt=(\w+)/.exec(location.search);
theme = theme ? theme[1] : "light";
changeTheme(theme);
function changeTheme(theme) {
var head = document.getElementsByTagName("head")[0];
var link = document.createElement("link");
link.dataset.type = "theme";
link.href = "assets/css/theme-" + theme + "/pages/home/home.css";
link.rel = "stylesheet";
link.type = "text/css";
head.appendChild(link);
}
方案2:借助插件
需要借助sass和一些插件不建议做
https://mp.weixin.qq.com/s/cecXgj5vClDYmGunJmGEag
大吉大利,终于不用写代码了。爽爽爽!!!
原文地址:https://blog.csdn.net/genius_yym/article/details/142454913
免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!