标签：hidden 配置文件 通过 spring func alt val var 管理系统
后台管理系统设计了多套主题皮肤，希望能随意切换主题风格。
在只有一套主题的时候，是在主页面上引入该主题样式：
<link href="/public/themes/default/css/main.css" rel="stylesheet" type="text/css" />
切换主题，其实就是切换css路径中的default为不同主题的值。如切换到block主题，只需修改为：
<link href="/public/themes/block/css/main.css" rel="stylesheet" type="text/css" />
每次切换主题，来修改此处的代码，然后再显然不是一个Good idea.
下面记录下自己的两个想法：
一、通过在spring配置文件中设置project.theme；
project.theme = block
在后台通过@Value等方法读取；
@Value("${project.theme}")
private String projectTheme;
然后通过springMVC的Model、Map、ModelMap或者ModelAndView传到前端主页面；
model.addAttribute("projectTheme", projectTheme);
主页面上通过input来保存这个主题值；
<input type="hidden" id="theme" th:value="${projectTheme}" >
然后js获取input的值，创建link标签，设置其href属性值，追加到主页面head中，
var theme = $("#theme").val();
loadTheme(theme);
function loadTheme(theme){ var link = document.createElement(‘link‘); link.type = ‘text/css‘; link.rel = ‘stylesheet‘; if(theme) link.href = ‘/public/themes/‘+theme+‘/css/main.css‘; else link.href = ‘/public/themes/default/css/main.css‘; var head = document.getElementsByTagName(‘head‘)[0]; head.appendChild(link); }
实现主题通过配置文件切换。
二、通过在页面上增加切换主题按钮，点击后修改数据库的主题字段值；
后台读取该字段的值，传到前端主页面；
后续步骤可以参考上面的。
在页面上点击切换按钮，就修改了主题风格。
备注:其实一开始是想这样修改的，然而没有成功：
<link href="/public/themes/${theme}/css/main.css" rel="stylesheet" type="text/css" />
欢迎大佬教育指导！
标签：hidden 配置文件 通过 spring func alt val var 管理系统
原文地址：https://www.cnblogs.com/xphhh/p/11331093.html
