单击链接-> set cookie -> additional stylesheet loaded
单击链接-> set cookie -> additional stylesheet loaded
提问于 2018-06-10 00:50:08
我使用hugo编写了我的静态站点。因为我更喜欢历史的默认布局，所以我对它完全没有意见，我不想改变它。
但一些读者更喜欢更现代的布局。我创建了它，让我们称它为pretty.css。(它就在我的另一个名为basic.css的css旁边。)
我想创建一个链接。单击此链接时，应设置cookie。设置此cookie时，必须将pretty.css添加到样式表中。
必须有第二个链接，它会删除该cookie。
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-06-10 01:27:52
下面是读取/设置cookie并基于此动态加载css的纯js方法。
<script type="text/javascript">
var preferredCss = getCookie('preferred_css');
if (!preferredCss || preferredCss.length == 0)
preferredCss = 'basic.css';
document.write('<link rel="stylesheet" type="text/css" href="'+preferredCss+'" />');
function setCookie(name,value) {
var expires = "";
var date = new Date();
date.setTime(date.getTime() + (60*24*60*60*1000));
expires = "; expires=" + date.toUTCString();
document.cookie = name + "=" + (value || "") + expires + "; path=/";
}
function getCookie(c_name) {
if (document.cookie.length > 0) {
c_start = document.cookie.indexOf(c_name + "=");
if (c_start != -1) {
c_start = c_start + c_name.length + 1;
c_end = document.cookie.indexOf(";", c_start);
if (c_end == -1) {
c_end = document.cookie.length;
}
return unescape(document.cookie.substring(c_start, c_end));
}
}
return "";
}
function deleteCookie(name) {
document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:01 GMT;path=/';
};
现在，当用户单击链接来设置pretty.css时，您只需像这样调用setCookie，
setCookie('preferred_css','pretty.css');要删除cookie，请调用
deleteCookie('preferred_css');页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50776512
复制相关文章
相似问题