Question

我有一个小问题：有没有办法如何用JavaScript改变文档中所有声音的音量（例如＆lt; video＆gt;，＆lt; embed＆gt;，＆lt; object＆gt;，...）？

修改

我想更改文档中的音量，例如＆lt; body volume =“0.5”＆gt; ...有什么帮助？

Answer 1

我想你可以将所有这些元素放在同一个类中（或者找到类似的方法来选择它们），然后执行以下操作：

var elements = document.getElementsByClassName('myVolumeClass');
var myDesiredVolume = 0.3;
for (var i = 0; i < elements.length; i++) {
    elements[i].volume = myDesiredVolume;
}

注意：未经过测试的代码

基本上，它都是关于修改音量属性的。

Answer 2

好，

以下是我将如何做到这一点：

<强> HTML：

<body>
  Master Audio Controller:-
  <input type="range" min="0" max="1" step="0.1" value="1.0" id="range">
  <span id="range_value">1.0</span>
  <br/>
  <video controls autoplay loop name="media" class="myVolumeClass">
    <source src="http://www.rbg.wz.cz/adventure/sounds/step.wav" type="audio/x-wav">
  </video>
  <br/>
  <video controls autoplay loop name="media" class="myVolumeClass">
    <source src="http://www.rbg.wz.cz/adventure/sounds/step.wav" type="audio/x-wav">
  </video>
  <br/>
  <video controls autoplay loop name="media" class="myVolumeClass">
    <source src="http://www.rbg.wz.cz/adventure/sounds/step.wav" type="audio/x-wav">
  </video>
  <br/>
</body>

<强> JavaScript的：

function updateVolume() {
  const newVolume = document.getElementById('range').value;
  document.querySelectorAll('video, audio, embed, object').forEach(element => element.volume = newVolume)
  document.getElementById('range_value').innerText = newVolume
}

document.addEventListener('DOMContentLoaded', function() {
  /* I'll Suggest to use $(document).ready(function(){ }); If Using JQuery */
  document.getElementById('range').addEventListener('input', updateVolume)
}

Here is a demo of this code

希望它有所帮助，欢呼：）！

更改文档中所有声音的音量

2 个答案: