Der ' gedämpft Mit dieser Eigenschaft können Entwickler die Audiowiedergabe steuern, indem sie ihnen die Möglichkeit bieten, den Ton je nach Bedarf stummzuschalten oder die Stummschaltung aufzuheben. Indem Endbenutzern die Möglichkeit gegeben wird, den Ton stummzuschalten oder die Stummschaltung aufzuheben, wird ihr Surferlebnis verbessert. Darüber hinaus ermöglicht die Verwendung von JavaScript eine dynamische Steuerung, die eine bessere Kontrolle über die Audiowiedergabe ermöglicht.
In diesem Artikel wird die Verwendung der HTML-DOM-Audio-Mute-Eigenschaft mithilfe von JavaScript beschrieben.
Wie verwende ich die HTML-DOM-Audio-Mute-Eigenschaft in JavaScript?
Der ' gedämpft Die Eigenschaft wird häufig verwendet, um den Ton auf einer Webseite stummzuschalten oder die Stummschaltung aufzuheben. Wenn der Wert des „ Audio.stummgeschaltet „Eigenschaft ist festgelegt als“ WAHR “, wird der Ton stummgeschaltet, und um die Stummschaltung aufzuheben, wird das „ gedämpft „Eigenschaft muss als“ festgelegt werden FALSCH “. Darüber hinaus lässt sich die muted-Eigenschaft mit anderen Mediensteuerelementen integrieren und ermöglicht eine browserübergreifende Kompatibilität.
Syntax
Die Syntax für die HTML-DOM-Audio-Mute-Eigenschaft in JavaScript ist unten angegeben:
selectedObj.muted = WAHR | FALSCH
Wo ' selectedObj „ist jede Audiodatei, deren Ton stummgeschaltet wird. Diese Eigenschaft kann nur zwei Werte speichern: „ WAHR ' oder ' FALSCH “. Wenn diese Eigenschaft auf „true“ gesetzt ist, wird die Audiodatei stummgeschaltet und umgekehrt.
Lassen Sie uns nun einige Beispiele durchgehen, um das HTML-DOM besser zu verstehen. gedämpft ' Eigentum.
Beispiel 1: Stummschalten der Audiodatei
In diesem Beispiel wird die ausgewählte Datei mithilfe der Funktion „ gedämpft ' Eigentum. Besuchen Sie zum Beispiel den folgenden Codeblock:
< div >< h2 Stil = „Farbe: Seegrün;“ > DOM Audio Muted-Eigenschaft h2 >< br >
< Audio- Ausweis = „demoAudio“ Kontrollen >
< Quelle src = „audio.mp3“ Typ = „Audio/mpeg“ >
Audio- >
< br >
< Taste onclick = „muteSetter()“ > Auf Stumm stellen Taste >
div >
< Skript >
lassen c = document.getElementById ( „demoAudio“ ) ;
Funktion muteSetter ( ) {
c.muted = WAHR ;
Alarm ( „Erfolgreich stummgeschaltet!“ )
}
Skript >
Erklärung des Codes:
-
- Erstens, der Elternteil „ div Es wird ein Element erstellt, das das Element „ ”-Tag mit der ID „ DemoAudio “. Dieses Element enthält ein einzelnes „ Quelle ”-Element, das die Adresse der ausgewählten Audiodatei zusammen mit ihrem Typ enthält.
- Als nächstes wird die Schaltfläche erstellt, die das „ muteSetter() ”-Funktion mit der Funktion „ onclick „Ereignis-Listener.
- Geben Sie dann „
Markieren Sie die Referenz des Elements „audio“ und speichern Sie sie in einer Variablen mit dem Namen „ C “. - Danach wird das „ muteSetter() „-Funktion wird erstellt, um den Wert für „ gedämpft „Eigenschaft zu“ WAHR “. Dadurch wird der Ton stummgeschaltet und die Meldung wird auch entsprechend im Warnfeld angezeigt.
Nach der Zusammenstellung:
Das obige GIF zeigt, dass der Ton mithilfe der muted-Eigenschaft stummgeschaltet wurde.
Beispiel: Stummschalten und Aufheben der Stummschaltung des Audios mithilfe der Muted-Eigenschaft
In diesem Beispiel wird die ausgewählte Audiodatei stummgeschaltet bzw. die Stummschaltung aufgehoben und ihr aktueller Status wird mithilfe der Schaltfläche „ abgerufen. gedämpft ' Eigentum. Besuchen Sie zum Beispiel den folgenden Code:
< div >< Audio- Ausweis = „demoAudio“ Kontrollen >
< Quelle src = „audio.mp3“ Typ = „Audio/mpeg“ >
Audio- >< br >
< Taste onclick = 'Stumm()' > Audio stumm schalten Taste >
< Taste onclick = „unMute()“ > Stummschaltung für Audio aufheben Taste >
< Taste onclick = „muteStatus()“ > Stummschaltungsstatus Taste >
div >
< Skript >
var z = document.getElementById ( „demoAudio“ ) ;
Funktion Stumm ( ) {
z.muted = WAHR ;
}
Funktion Stummschaltung aufheben ( ) {
z.muted = FALSCH ;
}
Funktion muteStatus ( ) {
Alarm ( z.gedämpft ) ;
}
Skript >
Die Erklärung des obigen Codes lautet wie folgt:
-
- Zunächst wird die Audiodatei mithilfe des HTML-Codes „ ' Und '
' Stichworte. - Anschließend werden drei Schaltflächen erstellt, die die Funktionen mit dem Namen „aufrufen“ Stumm() “, „ unMute() ', Und ' muteStatus() “. Diese Funktionen werden aufgerufen, wenn der Benutzer auf die entsprechenden Schaltflächen klickt.
- Als nächstes definieren Sie diese Funktionen, indem Sie die Werte „true“ und „false“ für „ Stumm() ' Und ' unMute() ”Funktionen. Für die „ muteStatus() ”-Funktion, fügen Sie nur das „ gedämpft ”-Eigenschaft mit der Audioreferenz, um den aktuellen Status der Mute-Eigenschaft abzurufen.
- Zunächst wird die Audiodatei mithilfe des HTML-Codes „ ' Und '
Nach der Kompilierung sieht die Ausgabe wie folgt aus:
Die Ausgabe zeigt, dass die Audiodatei stummgeschaltet bzw. die Stummschaltung aufgehoben wird und dass ihr Status auch mithilfe des Befehls „ gedämpft ' Eigentum.
Abschluss
Die HTML-DOM-Audio-Stummschaltungseigenschaft wird verwendet, indem zunächst die Audiodatei mit dem HTML-Code „“ auf der Webseite eingefügt wird. Audio- ' Und ' Quelle ”Elemente. Danach wird der Verweis auf dieses Audio in einer Variablen im JavaScript-Code gespeichert und das „ gedämpft „Eigentum ist damit verbunden. Um den Ton stummzuschalten, wird diese Eigenschaft auf „ WAHR ' Und ' FALSCH ” für Aufhebungsszenarien. In diesem Blog wurde der Arbeitsprozess der DOM-Audio-Mute-Eigenschaft demonstriert.