HTML Audio & Video
HTML DOM Audio defaultMuted Property
The defaultMuted property sets or returns whether a media element should be muted by default. It reflects the muted HTML attribute, which is different from the live muted property that reflects the element's current sound state.
Definition and Usage
There are two separate concepts of mute. The muted property is the current, live state and changes whenever the user or your code toggles sound. The defaultMuted property is the initial value, tied to the muted attribute, and is the state the element returns to when it is reset with load().
It is a boolean. Setting defaultMuted adds or removes the muted attribute in the markup, but it does not change whether the element is muted right now.
Syntax
// Get the value
let dm = mediaElement.defaultMuted;
// Set the value
mediaElement.defaultMuted = true;| Property | Meaning |
|---|---|
| muted | The current live mute state; changes as sound is toggled |
| defaultMuted | The default/reset mute state; reflects the muted attribute |
Example
This runnable page compares defaultMuted and muted. Unmuting live playback leaves defaultMuted unchanged, as the output shows.
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>defaultMuted Demo</title></head>
<body>
<h2>defaultMuted vs the live muted state</h2>
<video id="myVideo" width="320" muted controls>
<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
</video>
<p>
<button onclick="unmute()">Unmute live</button>
<button onclick="report()">Show both values</button>
</p>
<pre id="output"></pre>
<script>
const video = document.getElementById("myVideo");
function unmute() { video.muted = false; } // live change only
function report() {
document.getElementById("output").textContent =
"defaultMuted = " + video.defaultMuted + "\n" +
"muted = " + video.muted;
}
</script>
</body>
</html>To actually silence playback right now, set muted = true. Set defaultMuted only when you want to change the element's reflected muted attribute (its default/reset value).
Key Takeaways
- defaultMuted is a boolean reflecting the muted HTML attribute.
- It controls the default/reset state, not live playback.
- muted controls the current sound; the two can differ.
- Setting defaultMuted adds or removes the muted attribute but does not silence audio now.
- The element returns to defaultMuted when it is reset with load().