CSSMediaRule

Интерфейс CSSMediaRule представляет собой одно правило CSS @media.

Наследует свойства от своих предков CSSConditionRule, CSSGroupingRule и CSSRule.

CSSMediaRule.media Только для чтения

Возвращает MediaList, представляющий целевой тип среды для информации об стиле.

Нет специфичных методов; наследует методы от своих предков CSSConditionRule, CSSGroupingRule и CSSRule.

В представленном ниже CSS содержится запрос к среде с одним правилом стиля. Поскольку это правило находится в последнем добавленном стиле, оно будет первым правилом CSS, возвращаемым последним стилевым файлом в документе (document.styleSheets[document.styleSheets.length-1].cssRules). myRules[0] возвращает объект CSSMediaRule, из которого мы можем получить mediaText.

<p id="log"></p>

@media (min-width: 500px) {
  body {
    color: blue;
  }
}

const log = document.getElementById("log");
const myRules = document.styleSheets[document.styleSheets.length - 1].cssRules;
const mediaList = myRules[0]; // a CSSMediaRule representing the media query.
log.textContent += ` ${mediaList.media.mediaText}`;