MediaList | Web API

在此页

MediaList interface represents the media queries of a stylesheet, e.g. those set using a <link> 元素的 media 属性。

注意 : MediaList is a live list; updating the list using properties or methods listed below will immediately update the behavior of the document.

MediaList.mediaText: A stringifier that returns a DOMString 表示 MediaList as text, and also allows you to set a new MediaList .
MediaList.length 只读: Returns the number of media queries in the MediaList .

MediaList.appendMedium(): Adds a media query to the MediaList .
MediaList.deleteMedium(): Removes a media query from the MediaList .
MediaList.item(): A getter that returns a CSSOMString representing a media query as text, given the media query's index value inside the MediaList .

The following would log to the console a textual representation of the MediaList of the first stylesheet applied to the current document.

const stylesheets = document.styleSheets;
let stylesheet = stylesheets[0];
console.log(stylesheet.media.mediaText);

规范	状态	注释
CSS Object Model (CSSOM) The definition of 'MediaList' in that specification.	工作草案

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`MediaList`	Chrome Yes	Edge ≤18	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
`appendMedium`	Chrome Yes	Edge ≤18	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
`deleteMedium`	Chrome Yes	Edge ≤18	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
`item`	Chrome Yes	Edge ≤18	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
`length`	Chrome Yes	Edge ≤18	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
`mediaText`	Chrome Yes	Edge ≤18	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes