MediaQueryList.media

The media read-only property of the MediaQueryList interface is a DOMString representing a serialized media query.

Syntax

var media = MediaQueryList.media;

Value

A DOMString representing a serialized media query.

Examples

This example runs the media query (max-width: 600px) and displays the value of the resulting MediaQueryList's media property in a <span>.

JavaScript

let mql = window.matchMedia('(max-width: 600px)');

document.querySelector(".mq-value").innerText = mql.media;

The JavaScript code passes the media query to match into matchMedia() to compile it, then sets the <span>'s innerText to the value of the result's media property.

HTML

<span class="mq-value"></span>

A simple <span> to receive the output.

Result

Specifications

Specification
CSSOM View Module (CSSOM View) # dom-mediaquerylist-media

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
`media`	9	12	6	10	12.1	5.1	≤37	18	6	Yes	5	1.0