如何防止样式 sheet 在 IE 中加载,包括版本 10 和 11

How prevent a style sheet from loading in IE including versions 10 and 11

我想创建单独的样式表,一个用于所有 IE 版本,另一个用于 "normal browsers" ;)

您可以使用浏览器嗅探 - 类似于 How can I target only Internet Explorer 11 with JavaScript? and then load the right stylesheet using document.write (see When using document.write to load a different css stylesheet, browser refreshes infinitely)

您可能会找到想要的答案here

似乎已经回答

你可以一直这样

<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>
<!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。那样比较合适。但我不得不 post 这个,因为它太讨厌了。


编辑 这是禁用一个的简单方法sheet 并将其替换为另一个:

<code>
        <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