Javascript 如何让用户保存自定义样式表设置

我有一些样式表，但如何让用户保存上次在网站上的自定义样式表？我可以在Jquery和HTLM5中执行此操作吗？

是的，您可以执行此操作。您可以使用cookie、数据库或浏览器存储。如果您使用浏览器存储，它将是HTML5，如果您了解JavaScript，那么实现HTML5非常简单。否则，您有一个简单的方法，就是使用cookie，如果您有一个身份验证系统，请将该cookie与注销时删除的cookie分开，这样这些设置将保留，直到用户删除其cookie为止

Cookies，例如来自MSDN的Cookies

document.cookie = "test1=Hello";
document.cookie = "test2=World";
var cookieValue = document.cookie.replace(/(?:(?:^|.*;\s*)test2\s*\=\s*([^;]*).*$)|^.*$/, "$1");

function alertCookieValue() {
  alert(cookieValue);
}

e、 g.

document.cookie=myStyle

请参见此处的完整示例

然后是更可取的路由，HTML5，这里是一个示例

编辑：
这是一个可能为你做的粘贴箱（从我的来源看，你的方向是正确的）
 有许多不同的方法可以做到这一点，但是如果您不想让服务器上的数据库/cookie过多（这假设您的后端没有身份验证系统），那么您可以保存一个类，以便。。。例如，您需要执行css：

    $(document).ready(function () {
        applyTheme();
    });


    $(".theme").click(function (e) {
        e.preventDefault();

        //removes current stylesheet
        $("#customSheet").remove();

        //gets the theme name the user clicked
        var themeName = $(this)[0].id;

        //sets it to storage
        setTheme(themeName);

        //appends to the head so it loads
        $('head').append('<link href="css/' + themeName + '.css" rel="stylesheet" id="customSheet" />');
    });

    // sets local storage, pretty self explanatory, localstorage is an object that persists across the browser state until the user clears it out, usually because of some other plugin or just clears the cache
    function setTheme(theme) {
        localStorage.setItem('themeClass', theme);
    }

    //how to apply the theme to the document's body so that it can conditionally load 
    function applyTheme() {
        var theme = localStorage.getItem('themeClass');

        if (theme) {
            $('head').append('<link rel="stylesheet" type="text/css" href="css/' + theme + '.css" id="customSheet">');
        }
    }

$（文档）.ready（函数（）{
applyTheme（）；
});
$（“.theme”）。单击（函数（e）{
e、 预防默认值（）；
//删除当前样式表
$（“#customSheet”）.remove（）；
//获取用户单击的主题名称
var themeName=$（this）[0].id；
//将其设置为存储
设置主题（主题名）；
//附加到头部以使其加载
$（'head'）。追加（''）；
});
//设置本地存储，非常不言自明，localstorage是一个在浏览器状态下持续存在的对象，直到用户清除它为止，通常是因为其他插件或只是清除缓存
函数setTheme（主题）{
setItem（'themeClass'，theme）；
}
//如何将主题应用于文档的正文，以便它可以有条件地加载
函数applyTheme（）{
var theme=localStorage.getItem（'themeClass'）；
如果（主题）{
$（'head'）。追加（''）；
}
}

因此，如果在您最喜欢的东西中，css文件被称为“theme1”，那么如果路径正确，它将加载theme1

编辑：

实现这种特定方式的HTML是

<div id="theme">
    <input type="button" id="theme1" class="theme">
    <input type="button" id="theme2" class="theme">
</div>



这将一直工作到IE8，没有任何问题

你可以把它复制粘贴到某个地方，它会和你当前的东西一起工作

编辑：对于那些想知道在这里有一个粘贴后整个代码库会是什么样子的人：
取决于。。。你是否很好，他们完全删除它在某一点（明确的本地存储）@ MeviUS我不认为这是一个DUP的任何东西，除非你能找到一个特别的问题，问如何保存样式表，这是什么，样式表选择，而不是饼干…一旦读到这个评论，请随意删除。我也不同意它是一个傻瓜，至少不同意它可能是一个傻瓜of@Akidus请看@rnevius，当OP根本没有询问任何关于cookies的问题时，设置/获取cookies的问题不可能是一个愚弄的问题。酷，我想要快速、简单和更少的空间/代码。空间/代码越少越好。@Akidus为什么空间/代码越少越好，这样我的代码在index.html上就不会凌乱了。不乱用多种语言。编码最少，最简单？在jquery中，当他们选择样式时，无论您使用什么函数，都要立即更新存储，在本例中是cookie。我将添加一些代码片段，让您了解要添加的内容。@BrianThomas最好将一个类保存到localstorage，在加载到根区域时应用该类，然后根据根区域上的css定义当您看到文件时应该应用的主题？这里：我也在想，我可能还想要两个或更多的主题。代码还能工作吗？我下载了jquery.cookie，如果这有帮助的话。@Akidus我肯定能让它工作，只要模式有效就行。编码毕竟是关于模式的