1

在使用 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 重新计算所有样式吗?

4

0 回答 0