Question

我使用hugo编写了我的静态网站。由于我更喜欢历史默认布局，因此我很喜欢它而我不想改变它。

但有些读者更喜欢更现代的布局。我创建了它，让它称之为pretty.css。（它紧挨着我的另一个css，称为basic.css。）

我想创建一个链接。单击此链接时，应设置cookie。设置此Cookie后，必须将pretty.css添加到样式表中。

必须有第二个链接，删除该cookie。

Answer 1

这是一种纯粹的js方式来读取/设置cookie并根据

动态加载css

<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');

点击链接 - ＆gt;设置cookie - ＆gt;已加载其他样式表

1 个答案: