如何防止样式 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
我想创建单独的样式表,一个用于所有 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