禁用或隐藏样式表，如何操作

Disabling or hiding stylesheets, how do you do it?

本文关键字：何操作 操作 隐藏 样式      更新时间：2023-09-26

我正在构建一个必须完全在一个窗口外运行的网站，它永远无法加载另一个页面。因此，我使用了很多JS来交换屏幕上显示的内容，而且它实际上运行得很好。然而，我已经没有好的选择器了，我不希望我的样式表太长。所以，我想知道：是否可以通过将样式表放在设置为display:none的div中来禁用它？

例如：

<div style="display:none;">
    <style type="text/css">
        #my_image{
            height:100px;
            background-color:red;
        }
    </style>
</div>
<style type="text/css">
    #my_image{
        height:30px;
    }
</style>

在这种情况下，以下哪一项适用？我知道，如果两者都加载了，第二个将是最新的一个，所以它将是被读取的那个。但假设div从一开始就没有任何颜色。当这个脚本运行时，它会是红色的吗？

如果这不是禁用样式的可行解决方案，那么请告诉我是什么。

理想情况下，您应该为每个"主题"使用单独的样式表。

然后，您只能在运行时加载正确的样式表，或者：

  • 使用javascript在头部创建/销毁css链接元素

  • 使用javascript将类添加到body标记"red"或"blue"等。然后让主题中的每个选择器都以类名开头：

    .blue.header｛background:红色；｝

相关文章：