javascript - window.matchMedia(mediaQueryString) 是否接受 mediaQueryString 变量？

Question

为了方便起见，我想构建一个函数来评估并返回各种媒体查询的结果。为此，我编写了以下内容:

//Evaluate Media Query
function eMQ(crit) {
    //Build Media Query From Criteria Parameter
    var lMQ = window.matchMedia(crit);
    //Evaluate and Return Result
    if (lMQ.matches) {
        return true;
    } else {
        return false;
    };
};

我想知道 window.matchMedia(crit) 是否会正确使用 crit 字符串，就好像该字符串是显式写入的一样。

快速编辑:考虑到上面的函数本质上只是带有更多步骤的 window.matchMedia() ，我认为我应该澄清我的目的。我只是发现 window.matchMedia() 很笨拙，并且想要一个较短的版本，不需要在末尾包含 .matches 。

Answer 1

只要您传递有效的媒体查询字符串，您的函数就应该正常工作，无论是否:

• 您将该媒体查询从变量发送到 matchMedia。
• 您显式地将硬编码媒体查询字符串发送至 matchMedia。

例如:

var crit = "(max-width: 700px)";
var lMQ = window.matchMedia(crit);

将得到与以下相同的结果:

var lMQ = window.matchMedia("(max-width: 700px)");