MediaList
The MediaList
interface represents the media queries of a stylesheet, e.g. those set using a <link>
element's media
attribute.
Note: MediaList
is a live list; updating the list using properties or methods listed below will immediately update the behavior of the document.
Properties
MediaList.mediaText
-
A stringifier that returns a
DOMString
representing theMediaList
as text, and also allows you to set a newMediaList
. -
MediaList.length
Read 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
CSSOMString
representing 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
Browser compatibility
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
MediaList |
1 |
12 |
1 |
9 |
≤12.1 |
1 |
1 |
18 |
4 |
≤12.1 |
1 |
1.0 |
appendMedium |
1 |
12 |
1 |
9 |
≤12.1 |
1 |
1 |
18 |
4 |
≤12.1 |
1 |
1.0 |
deleteMedium |
1 |
12 |
1 |
9 |
≤12.1 |
1 |
1 |
18 |
4 |
≤12.1 |
1 |
1.0 |
item |
1 |
12 |
1 |
9 |
≤12.1 |
1 |
1 |
18 |
4 |
≤12.1 |
1 |
1.0 |
length |
1 |
12 |
1 |
9 |
≤12.1 |
1 |
1 |
18 |
4 |
≤12.1 |
1 |
1.0 |
mediaText |
1 |
12 |
1 |
9 |
≤12.1 |
1 |
1 |
18 |
4 |
≤12.1 |
1 |
1.0 |
© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/MediaList