CSSImportRule: media プロパティ

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.

media は CSSImportRule インターフェイスの読み取り専用プロパティで、 MediaList オブジェクトを返します。ここには関連付けられたスタイルシートの media 属性の値が入っています。

値

MediaList オブジェクトを返します。

media の値は、 media 属性を格納した文字列（"print" など）を渡すことで設定することができます。

例

メディアプロパティの取得

このスタイルシートには単一の @import ルールが記載されています。したがって、 CSS ルールのリストの最初の項目は CSSImportRule になります。 media プロパティは MediaList オブジェクトを返します。この中には mediaText プロパティの値 screen が含まれます。

css
@import url("style.css") screen;
js
let myRules = document.styleSheets[0].cssRules;
console.log(myRules[0].media); // MediaList を返す

メディアプロパティの設定

関連するスタイルシートの media 属性を変更するには、 media の値に新しい値を格納した文字列を設定します。

js
let myRules = document.styleSheets[0].cssRules;
myRules[0].media = "print";

仕様書

Specification
CSS Object Model (CSSOM)
# dom-cssimportrule-media

ブラウザーの互換性

BCD tables only load in the browser