Bouton Mute/Unmute pour le bruit de fond

Question

les gars. Merci de m'expliquer cela. Je voulais créer un seul bouton mute/unmute pour ma page. (Audio démarre automatiquement) Voici le code que j'utilisé première fois:

<script> 
 
var sound = getElementById (‘background_sound’); 
 
     function mute(){ 
 
      if(background_audio.muted == false){ 
 
      background_audio.muted = true; 
 
      } else { 
 
      background_audio.muted = false; 
 
      } 
 

 
} 
 
</script>

Mais cela n'a pas fonctionné. Donc j'ai juste enlevé la première ligne (je veux dire cette var) et ai adressé l'id directement. Et ça a marché. Maintenant, mon html ressemble à ceci:

<audio id="background_audio" autoplay="true" loop="loop"> 
 
      <source src="Audio/flute.mp3"> 
 
If you are reading this, it is because your browser does not support the audio element. 
 
</audio> 
 

 
<button onclick="mute()"> 
 
     <i class="fa fa-music"></i></button>

Et javascript comme ceci

<script> 
 

 
     function mute(){ 
 
      if(background_audio.muted == false){ 
 
      background_audio.muted = true; 
 
      } else { 
 
      background_audio.muted = false; 
 
      } 
 

 
} 
 
</script>

La question est de savoir comment puis-je aborder Id directement sans créer une variable ? Cela fonctionne bien, mais aurai-je des problèmes avec le code plus tard? J'ai juste pensé que je devais assigner un var ceci pour fonctionner. Un peu confus.

Answer 1

essayer ce que je suis sûr que cela fonctionnera

<script> 

      function mute(){ 
       if(document.getElementById('background_audio').muted == false){ 
       document.getElementById('background_audio').muted = true; 
       } else { 
       document.getElementById('background_audio').muted = false; 
       } 

    } 
    </script>