Jquery 检查哪个样式表处于活动状态并隐藏div

我目前有一个在两个主要样式表之间切换的主题

设计中有一个单一的元素是不可通过CSS改变的，所以我决定用适当的颜色在两个不同的版本之间切换可见性。（这是一个通过javascript加载的标记云；一个版本匹配第一个主题的颜色，另一个版本匹配另一个主题的颜色。）下面是我添加的用于切换面板的非常简单的代码：

$(function(){
    $('#pink').click(function(){
        $('#pinkcloud').show("fold");
        $('#greencloud').hide("fold");
     });
    $('#green').click(function(){
        $('#greencloud').show("fold");
        $('#pinkcloud').hide("fold");
    });
});

（#绿色和#粉色是与要单击以更改主题的链接相对应的ID。）

问题是，主题在cookies上运行，所以它会记住您选择的主题。div显然没有，因此无论浏览器记住什么主题，默认的div都会自动加载

我应该向代码中添加什么来确保浏览器检查哪个样式表处于活动状态，并在加载时显示正确的div？如何在javascript中检查当前正在读取的文件

有时候我很难解释事情，所以这里是主题，这样你就可以真正理解我的意思（）。要查看问题，请单击绿色主题选项，刷新页面，然后查看剪报部分，该部分将为粉红色。您可以再次单击绿色主题选项以显示正确颜色的部分，但我显然希望自动显示正确的部分

---

可以找到主题切换的代码，这样您就可以看到它是如何工作的

您必须在页面加载和单击事件中运行该代码。您的“#pinkcloud”元素是默认显示的元素，因此您只需在“switchstyle”函数中添加以下内容，即可更改为绿色样式：

if(styleName==='green') { 
    $('#greencloud').show();
    $('#pinkcloud').hide(); 
}

---

是的，您需要在cookie中存储一些值，以便在样式表之间切换，从而可以保留信息

所以，我的工作可能是粗糙的，需要一些测试，但首先我会使用一个非常好的和轻饼干插件发现

然后，您需要一些jquery，大致如下：

$(window).on('load',function(){
   $.cookie('cookieName', 'green', { path: '/', expires: 365}); // set as the default on the root document for 1 year. 
});

$(document).ready(function(){
   $('#pink').click(function(){
      $.cookie('cookieName', 'pink', { path: '/', expires: 365}); // set on click
   });
   $('#green').click(function(){
      $.cookie('cookieName', 'green', { path: '/', expires: 365}); // reset to original
   });
});

然后我会在文档的头部添加一个样式表，并给它一个id

<link id="cssToggle" rel="stylesheet" type="text/css" href="http://yoursite.com/css/green-style.css" />

我可能已经完全夸大了这一点，可能会有更优雅的解决方案，但我相信这会奏效。我要试试看

---

编辑：在这里工作的粗糙示例：

我将继续工作，但在正确添加代码时遇到问题。我仍然不太明白if-else语句的语法，但是我再做一些修改后会给你回复的！快速提问：为什么使用样式表链接？你看，我已经考虑了主题之间的切换。我只是想在这个特定函数中，当主题发生变化时，注意2个div的可见性，并使显示的div与给定的主题相匹配。我相信当你说我需要做一个新的饼干时，你绝对是对的，这肯定会有帮助的！我只是想澄清我在这个例子中需要什么，你的解释似乎是朝着切换css的方向。切换div可见性并保存cookie中最后可见的内容是我想要的。使用您的部分建议（和代码），我调整了我的代码，现在它可以工作了！我只是在点击时做了cookies，并在条件中应用了隐藏代码。谢谢你的帮助！是的，我是这样写的，因为你问题的第一行指出“我目前有一个在两个主样式表之间切换的主题。”但似乎你试图实现的代码要简单得多。但我很高兴这对我有所帮助。

if ($.cookie('cookieName') === 'green') {
   $('#cssToggle').attr('href','http://yoursite.com/css/green-style.css')
}else if($.cookie('cookieName') === 'pink'){
   $('#cssToggle').attr('href','http://yoursite.com/css/pink-style.css')
}