使用cookie在网站上保留样式表首选项
我有一个简单的javascript函数，它允许我在我的网站的每个页面中的不同样式表之间交换。 目前我没有在网站上实现任何cookie，因此每当我进入新页面时，都会加载默认样式表，如果用户想要使用备用样式表，他们将被迫再次交换。 我想通过使用cookie来实现目标，用户选择的样式表在转到不同的页面时会保留。
下面我有以下代码，这是我交换样式表的方法。
var i=1; function styleSheet(){ if(i%2==0){ swapper('css/main.css'); } else{ swapper('css/stylesheetalternate.css'); } i++; } function swapper(select_sheet){ document.getElementById('swapper').setAttribute('href', select_sheet); } 到目前为止，我还没有能够将网页记住用户选择作为样式表主题的内容，以及重新加载页面时保留相同的样式表。 这是我第一次使用cookie，而我主要只是想找到一种方法来使用我原来的javascript来实现它。
编辑：也是一个抬头，我现在只知道前端网络编程。 基于Dave A的答案，我是否会按照以下方式调整当前的styleSheet（）函数，或者这甚至不再需要了？ 我有点难以理解的一件事是关键是如何工作的。
var i=1; function styleSheet(){ if(i%2==0){ storeStyleSheet(sheet1, main.css); } else{ storeStyleSheet(sheet2, alternate.css); } i++; }
我会使用HTML 5本地存储来存储CSS文件名：
使用以下function存储用户的选择：
function storeStyleSheet(styleSheetKey, StyleSheetName){ localStorage.setItem(styleSheetKey, StyleSheetName); }
并拉动并使用存储的CSS，如果有的话：
function setStoredStyleSheet(styleSheetKey){ var styleSheet = localStorage.getItem(styleSheetKey); if(!(styleSheet=='undefined' || styleSheet==undefined) ){ swapper(styleSheet); } else{ swapper('css/stylesheetalternate.css'); } }
我发现HTML 5本地存储比cookie更容易使用。 我在任何浏览器上使用localStorage都没有任何问题。 界面直观; 请注意，如果之前从未存储过文件/ keyname，它将返回’undefined’或undefined。 localStorage也没有自动超时。
最简单的方法是引入所有CSS（除非它很大），然后将主题类应用到body /您需要的任何地方。 你的CSS看起来像
// common and default definitions body.some-theme{ // theme overrides of default go here } body.some-other-theme{ // another theme }
如果你想要一个记住用户而不是浏览器/ ip地址的解决方案（记住每个浏览器都有自己的cookie jar），你最好用服务器端语言编写这个用户首选项，并且只输出相关的CSS文件。服务器端处理。
然而，这是一个更大的问题，要快速解决手头的问题，请考虑以下问题。
首先加载所有CSS文件，假设它们不是很大，它可能不会在速度上有太大差异，这意味着用户可以在没有下载额外数据的开销的情况下进行切换。
我同意Dave A的观点，localStorage方法可能是存储此信息的最佳方式（没有存储用户首选项的服务器）。 所以我建议你写一些类似于下面的东西，我很快就把它砍成了这个，因为我确信它很明显。
hbdfisubfiuodfhriubsrfiub iboufruewhiobieiohhbefpijbepojb hbdfisubfiuodfhriubsrfiub iboufruewhiobieiohhbefpijbepojb hbdfisubfiuodfhriubsrfiub iboufruewhiobieiohhbefpijbepojb hbdfisubfiuodfhriubsrfiub iboufruewhiobieiohhbefpijbepojb
如果你想沿着当地的仓库路线走，我忘了提这个： http ： //mozilla.github.io/localForage/？javascript#localforage
可能值得一读。