MediaQueryList

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

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

方法概述

void addListener(MediaQueryListListener listener);
void removeListener(MediaQueryListListener listener);

实例属性

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

matches 只读

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

media (en-US) 只读

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

方法

addListener()

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

void addListener(
  MediaQueryListListener listener
);

参数 ( 针对 addListener 方法)

listener

当其媒体查询的求值结果发生变化时,该 MediaQueryListListener (en-US) 对象将会被调用。

removeListener()

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

void removeListener(
  MediaQueryListListener listener
);

参数 (针对 removeListener 方法)

listener

MediaQueryListListener (en-US)对象将停止访问媒体查询的求值结果发生的变化。

规范

Specification
CSSOM View Module
# the-mediaquerylist-interface

浏览器兼容性

BCD tables only load in the browser

参见