MediaList
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â©.
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.
Instance properties
MediaList.mediaText-
A stringifier that returns a string representing the
MediaListas text, and also allows you to set a newMediaList. MediaList.lengthRead only-
Returns the number of media queries in the
MediaList.
Instance 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 string representing a media query as text, given the media query's index value inside the
MediaList. This method can also be called using the bracket ([]) syntax. MediaList.toString()-
Returns a string representation of this media list in the same format as the object's
MediaList.mediaTextproperty.
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 |
|---|
| CSS Object Model (CSSOM) # the-medialist-interface |