如何静音 iframe 内容？答案

【问题标题】：How to mute an iframe content?如何静音 iframe 内容？
【发布时间】：2015-11-04 18:01:21
【问题描述】：

我有一个第三方 iframe，其中包含来自 youtube、vimeo 等的视频...

是否有一种通用的方法可以使来自视频/音频来源的 iframe 内容独立静音？

【问题讨论】：

可能重复：stackoverflow.com/questions/25354184/how-to-mute-an-iframe, stackoverflow.com/questions/26654655/…
自 2021 年起，这目前是不可能的。如果您希望它得到支持，盯着 this issue 可能会帮助 Chromium 贡献者衡量兴趣。如果您有特定的用例，您也可以对该问题发表评论（但请不要评论简单/无用的内容，例如“我需要这个！” - 只需加注星标即可）

标签： javascript iframe youtube vimeo mute

【解决方案1】：

第 1 步。首先您需要访问 iframe。

var iframe = document.getElementById('iframeId');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;

Step2. 获得内部文档引用后，您可以访问其内部 DOM 元素。假设您的视频/音频元素 id 为 mediaElem。

var MediaSource = innerDoc.getElementById('mediaElem');

Step3. 现在你可以用它做任何你想做的事了。在您的情况下，如果您想静音，只需设置即可。

MediaSource.muted=true;

【讨论】：

这将在第 1 步失败，因为它是第 3 方 iframe。
那你就不能访问了。这是一个cross-origin policy，但如果你的所有东西都在同一个域上，它就像一个魅力。
它是第 3 方 iframe。我无法访问
TypeError: 无法设置属性“静音”为空
@naturevetri 您指的是哪个 iframe？请确保您使用了正确的 Iframe Id，并且它应该在同一个域中

【解决方案2】：

您也可以调用它并将其音量设置为零或暂停它，在 javsscript 中是这样的：var media = document.getElementById('mediaId'); media.volume = 0; /*set volume to zero|takes values btw 0-1*/ media.pause(); /*pause the audio/video*/

【讨论】：