在使用 JS 向<link rel="stylesheet">
我的文档添加新样式后,我希望浏览器请求新样式表并应用其样式,而 IE 9 就是这样做的。但是,IE 9 不尊重文档中其他样式的优先级,例如。在随后的样式块中。
给定这样的样式表blue.css
:
.box { background-color: blue; }
..和这样的文件..
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js">
</script>
<!--- The JS below inserts a stylesheet <link> here --->
<style>.box { background-color: red; }</style>
</head>
<body>
<div class="box">hello</div>
<script>
$(function(){
$('<link rel="stylesheet" href="blue.css" type="text/css" />')
.insertBefore($('style'));
});
</script>
</body>
</html>
说完了,IE 9 会显示一个蓝色框,而其他浏览器(如 FF 12 或 Chrome 19)会显示一个红色框。
IE只是在这里偷懒吗?懒惰这个词是不是太好了?我应该强制 IE 使用这样或这样的 hack 重新计算所有样式吗?