2

首先,我想强调一下,我是 javascript 编程的新手,我正在尝试从这里尽可能多地学习。阅读查询 js api、文档以及源代码。我想知道查询 js 和常规使用 matchmedia 和 resize 事件侦听器有什么区别。

查询js链接:http ://wicky.nillia.ms/enquire.js/

将不胜感激任何贡献

4

1 回答 1

9

在这里询问作者:) 我偶尔会关注关于它的问题,所以我可以提供帮助。

没有区别,inquiry 是建立matchMedia 之上的。因此,一个更相关的问题可能是“inquire 在 matchMedia API 之外提供什么?”

询问,最基本的是 matchMedia API 的简单包装器。它的目标是消除您经常使用 matchMedia 编写的样板代码(它本身并不是一个非常好的 API)。它还为处理媒体查询提供了更多完整的生命周期:设置(可以选择延迟)、匹配、取消匹配、销毁。您必须自己处理所有这些,而无需询问。此外,它还简化了注销媒体查询并为旧版浏览器提供了一个陷阱门,shouldDegrade

换句话说,在 JS 中使用 MQ 做相当高级的事情时,查询是很好的。否则,您可以只使用原始 matchMedia API——我绝对推荐它用于简单的东西。如果你走这条路,绝对不要使用调整大小事件,因为你必须将逻辑放入去抖动事件等,它会很快变得复杂!而是使用浏览器的原生 MediaQueryList.addListener:

matchMedia("screen and (min-width:40em)").addListener(function(mql) {
   if(mql.matches) {
        // do something when matching
   }
   else {
        // do soemthing when no match
   }
});

希望这可以为您解决问题

于 2013-10-09T09:44:08.643 回答