14

我正在使用 JavaScript 启用/禁用样式表，使用以下内容：

document.styleSheets[0].disabled = true|false;

这个 JS 工作正常，但是我希望默认情况下禁用样式表。虽然我可以使用上面的 JS 在页面加载时立即禁用样式表，但这显然不适用于关闭 JavaScript 的用户。

我试过这样做：

<link rel="stylesheet" href="style.css" disabled />

虽然这会禁用样式表，但 JavaScript（或至少我正在使用的方法）无法再次启用它。我还尝试了“禁用”属性的所有这些变体：和disabled="disabled"，但这些都产生了同样的问题——我无法使用 JavaScript 再次启用它们。disabled="true"disabled=true

简而言之，我需要一种使用 JavaScript 启用/禁用外部样式表的方法，但默认情况下禁用该样式表但不依赖于 JavaScript。

任何帮助将不胜感激。谢谢。

注意这个效果可以通过使用两个样式表来实现，第二个覆盖第一个，因此不需要“禁用”属性。但是，如果可能的话，显然最好只使用一个样式表，因此我的问题在上面。

4

3 回答 3

17

您可以为此使用 JavaScript 的 removeAttribute 方法。

<html>
    <head>
        <link id="first_style" rel="stylesheet" href="#" disabled />

        <script type="text/javascript">
            window.onload = function()
            {
                document.getElementById('first_style').removeAttribute('disabled');
            }
        </script>
    </head>
    <body>
        <p>something</p>
    </body>
</html>
于 2012-05-12T15:12:19.597 回答
3

为什么不解决问题：仅在启用 JavaScript 时才加载 CSS？

从这个例子中，你可以使用类似的东西：

var fileref=document.createElement("link")
fileref.setAttribute("rel", "stylesheet")
fileref.setAttribute("type", "text/css")
fileref.setAttribute("href", filename)
于 2012-05-12T15:09:02.033 回答
1

我认为在这种情况下你可能不得不依赖 JavaScript。

如果您想更多地考虑在需要时提供样式表而不是默认禁用，那么您应该确定它。

于 2012-05-12T15:08:13.567 回答