如何防止在 IE 中加载样式表，包括版本 10 和 11答案

【问题标题】：How prevent a style sheet from loading in IE including versions 10 and 11如何防止在 IE 中加载样式表，包括版本 10 和 11
【发布时间】：2015-08-03 14:27:00
【问题描述】：

我想创建单独的样式表，一个用于所有 IE 版本，另一个用于“普通浏览器”；）

【问题讨论】：

我相信你不能用 html/css 来做，你必须用 javascript 检查用户代理
你也可以发布你的代码，也许我们会发现为什么在 IE 中如此 glithcy..

标签： internet-explorer stylesheet css-animations internet-explorer-10 internet-explorer-11

【解决方案1】：

<!DOCTYPE html>
<html>
<head>
    <title> overwrite cssText if IE.  ewww nasty.  </title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <style type=text/css>
        body { font-family:'Segoe UI',sans-serif; font-size:14pt; color:black }
        #customLook { display:inline-block; margin-top:50px; margin-left:50px }
    </style>
    <link id=animstyle rel=stylesheet type=text/css href=animstyle.css>
    <script>
        var s= (animstyle.sheet||animstyle.styleSheet)                  // w3c-browser OR ie8
        if (s && s.cssText) s.cssText= ".customSpan:before{content:'not ';color:red}"   // only IE implements sheet.cssText  (including Edge)  it's r/w.
    </script>
</head>
<body>
    <div id=customLook>
        <span class=customSpan>ANIMATED</span>
    </div>
</body>
</html>

试试这个online demo

实际上，您可以改用s.disabled=true，然后启用其他一些css链接。那会更合适。但是我不得不发布这个，因为它太讨厌了。

编辑这是禁用一张纸并用另一张纸替换它的简单方法：


        <link id=animstyle rel=stylesheet type=text/css href=animstyle.css>
        <script>
            var s= (animstyle.sheet||animstyle.styleSheet)                  // w3c-browser OR ie8
            if (s && s.cssText) s.disabled= true                        // only IE implements sheet.cssText  (including Edge)  it's r/w.
        </script>
        <link rel=stylesheet type=text/css href=NOanimstyle.css onload="(this.sheet||this.styleSheet).disabled=!s.disabled">

demo ver2

【讨论】：

您好，感谢您的帮助。您的演示肯定有效。至少在 IE11 中。这适用于所有 IE 版本吗？如果是这种情况，我想使用它。我只是不确定它是如何工作的。抱歉，我对 JavaScript 完全是个文盲。您是否建议我使用一个包含动画的样式表和另一个不包含动画的样式表？这可能对我有用......我将第二个样式表链接放在哪里？

【解决方案2】：

您可能会找到您正在寻找的答案here

似乎已经回答了

【讨论】：

如果您要使用<!--[if gt IE 9]>，例如，它将是 10 或 11 的条件。
我认为版本 10 和 11 不再支持条件注释。我已经对此进行了测试，但它没有加载样式表：

【解决方案3】：

您可以使用浏览器嗅探——例如How can I target only Internet Explorer 11 with JavaScript?，然后使用 document.write 加载正确的样式表（请参阅When using document.write to load a different css stylesheet, browser refreshes infinitely）

【讨论】：

【解决方案4】：

你总是可以这样的

<script>
var ltie11 = /msie/.test(navigator.userAgent.toLowerCase());
var ie11 = /Trident/.test(navigator.userAgent);
if( ! (ltie11 || ie11) ) {
    var $link = $('<link>').attr('type','text/css').attr('src', 'css/css.css');
    $('body').append($link);
}
</script>

【讨论】：

我试过了，但它没有加载样式表。我错过了什么吗？ <script> var ltie11 = /msie/.test(navigator.userAgent.toLowerCase()); var ie11 = /Trident/.test(navigator.userAgent); if( ! (ltie11 || ie11) ) { var $link = $('<link>').attr('type','text/css').attr('src', 'css/styles-no-animation.css'); $('body')append.($link); } </script>
您是否包含 jquery 并且路径正确？
我正在使用<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
语法错误，请使用我更新的代码！
您是否在控制台日志中看到任何错误或与实际代码有链接？