javascript - HTMLMediaElement.muted = true 便携吗？

Question

我试图将音频静音，却发现在andsetAttribute下根本不起作用。据我所知，这是设置布尔属性的标准方法。Firefox 80.0.1Chrome 85.0.4183.102

video.setAttribute("muted", "muted");

令人惊讶的是，video.muted = true有效。我不确定它是否可移植，因为它没有使用标准函数SetAttribute，并且值不是muted.

Answer 1

muted属性映射到IDL，而.defaultMuted不是直接映射到.muted属性。

该.muted属性首先设置为此.defaulMuted值，但之后更改该.defaultMuted值不会更改该.muted值。

这意味着在解析时，属性将设置 的初始值.muted，但随后不会更改属性。

const vid = document.getElementById("vid");
console.log( vid.defaultMuted ); // true (because it has the attribute)
vid.removeAttribute( "muted" ); // set defaultMuted to false
console.log( vid.defaultMuted ); // false (no attribute anymore)
console.log( vid.muted ); // true (still muted anyway)
vid.defaultMuted = true; // set back the attribute through IDL
console.log( vid.getAttribute( "muted" ) ); // "" (which is a truthy value for booleans, would have been `null` if unset)

<video controls id="vid" muted></video>

动态静音/取消静音 HTMLMediaElement 的正确方法确实是通过其.muted属性，但这不会在元素上设置任何属性。