The MediaList interface represents the media queries of a stylesheet, e.g. those set using a <link> element's media attribute.
Properties
MediaList.mediaText- A stringifier that returns a
DOMStringrepresenting theMediaListas text, and also allows you to set a newMediaList. MediaList.lengthRead only- Returns the number of media queries in the
MediaList.
Methods
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
CSSOMStringrepresenting a media query as text, given the media query's index value inside theMediaList.
Examples
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);
Specifications
| Specification | Status | Comment |
|---|---|---|
| CSS Object Model (CSSOM) The definition of 'MediaList' in that specification. |
Working Draft |
Browser compatibility
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.
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
MediaList | Chrome Full support Yes | Edge Full support ≤18 | Firefox Full support Yes | IE ? | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
appendMedium | Chrome Full support Yes | Edge Full support ≤18 | Firefox Full support Yes | IE ? | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
deleteMedium | Chrome Full support Yes | Edge Full support ≤18 | Firefox Full support Yes | IE ? | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
item | Chrome Full support Yes | Edge Full support ≤18 | Firefox Full support Yes | IE ? | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
length | Chrome Full support Yes | Edge Full support ≤18 | Firefox Full support Yes | IE ? | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
mediaText | Chrome Full support Yes | Edge Full support ≤18 | Firefox Full support Yes | IE ? | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
Legend
- Full support
- Full support
- Compatibility unknown
- Compatibility unknown
