MediaQueryList

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

一个 MediaQueryList 对象在一个 document 上维持着一系列的媒体查询，并负责处理当媒体查询在其 document 上发生变化时向监听器进行通知的发送。

如果你需要以编程方式来检测一个 document 上的媒体查询的值的变化，这个 MediaQueryList 对象使得通过观察其 document 而检测它的媒体查询的值的变化成为可能，而不是周期性地对这些媒体查询的值进行检查。

实例属性

MediaQueryList 接口从它的父接口 EventTarget 继承了属性。

matches 只读

一个布尔值，如果当前 document 与媒体查询列表相匹配，则返回 true，否则返回 false。

media 只读

代表序列化的媒体查询的字符串。

方法

addListener()

在媒体查询列表上增加一个新的监听器，如果列表中已经存在了这个指定的监听器，这个方法将失去作用。

参数 ( 针对 addListener 方法)

listener

当其媒体查询的求值结果发生变化时，该 MediaQueryListListener 对象将会被调用。

removeListener()

从媒体查询列表中移除一个监听器，如果列表中不存在这个指定的监听器，则这个方法将失去作用。

参数 (针对 removeListener 方法)

listener

该 MediaQueryListListener对象将停止访问媒体查询的求值结果发生的变化。

规范

Specification
CSSOM View Module
# the-mediaquerylist-interface

浏览器兼容性

BCD tables only load in the browser

参见