javascript - 为什么我无法使用 Modernizr 检测 IE9 中的媒体查询

Question

我搜索了浏览器对CSS3媒体查询的支持，IE9+支持，http://caniuse.com/css-mediaqueries ，但是当我用Modernizr检测时，发现ie7-ie9不支持，ie10支持。我所做的是:

1. 生成自定义现代化js:http://modernizr.com/download/#-mq-teststyles-load

2. html代码:下面是我在html头中的代码，我想检测浏览器是否支持最小宽度媒体查询的使用，如果支持，则添加support.js，如果不支持，则包含nosupport。 js

   <script src="modernizr.custom.03829.js" type="text/javascript"></script>
   <script>
       Modernizr.load({
           test: Modernizr.mq('(min-width: 0px)'),
           yep: 'support.js',
           nope: 'nosupport.js'
       });
   </script>
   

3. 在 support.js 中:alert("support");

4. 在nonosupport.js中:al​​ert("不支持");

结果:ie7-ie9 警报“不支持”，在 ie10 中警报“支持”。我想ie9也应该提醒“支持”吧？我的代码有问题吗？

另一个奇怪的事情是，如果我使用 http://modernizr.com/docs/#mq 中的示例用法:

Modernizr.mq('only screen and (max-width: 768px)')  // true

Chrom、firefox和IE7-10会提示“不支持”，我认为现代浏览器应该提示“支持”。为什么？

Answer 1

关于你的第一个问题 - 我无法复制。 Modernizr.mq('(min-width: 0px)') 在 IE 9 中为我返回 true 。检查 F12 工具中的文档模式，看看是否退回到非标准模式。

第二，浏览器的现代性与它是否会返回 true 无关。 Modernizr.mq 测试浏览器是否与媒体查询匹配。如果为 false，则表示浏览器窗口大于 768 像素。