HTML DOM Link media Property

Last Updated : 22 Aug, 2022

The HTML DOM link media property is used to set or return the value of the media attribute of an <link> element. The media attribute is used to specify what type of media devices the target resource is optimized.

Syntax:

It is used to return the media property.

linkObject.media;

It is used to set the media property.

linkObject.media="values"

Property values:

all: Suitable for all devices
aural: Speech synthesizers
braille: Braille feedback devices
handheld: Handheld devices (small screen, limited bandwidth)
projection: Projectors
print: Print preview mode/printed pages
screen: Computer screens
tty: Teletypes and similar media using a fixed-pitch character grid
tv: Low resolution or limited scroll ability type devices like Television.

Return Value: It returns a String value which represents media types comma-separated list.

Example: Below HTML code illustrates, how to return the link media property.

HTML

<!DOCTYPE html>
<html>
<head>
    <link id="linkid" rel="stylesheet"
        type="text/css" href="" media="screen">
</head>
 
<body style="text-align:center;">
    <h1>GeeksforGeeks</h1>
    <h2>DOM Link media Property</h2>
    <button onclick="btnclick()">Return</button>
    <p id="pid" style="font-size:25px;color:green;">
    </p>
 
    <script>
        function btnclick() {
             
            // return Link media Property
            var newVar = document
                .getElementById("linkid").media;
 
            document.getElementById(
                "pid").innerHTML = newVar;
        }
    </script>
</body>
</html>