” ミュートされた 」プロパティを使用すると、開発者は、ニーズに応じてオーディオをミュートまたはミュート解除するオプションを提供することで、オーディオの再生を制御できます。エンド ユーザーが音声をミュートまたはミュート解除できる自由を提供すると、ブラウジング エクスペリエンスが向上します。さらに、JavaScript を使用すると、オーディオ再生をより適切に制御できる動的制御が可能になります。
この記事では、JavaScript を使用した HTML DOM オーディオのミュート プロパティの使用方法について説明します。
JavaScript で HTML DOM Audio Muted プロパティを使用する方法
” ミュートされた 」プロパティは、Web ページ上の音声をミュートまたはミュート解除するためによく使用されます。 「」の値が 音声.ミュート ” プロパティは” として設定されます 真実 」を選択すると音声がミュートされ、ミュートを解除するには「 ミュートされた ” プロパティを” として設定する必要があります 間違い ”。さらに、ミュートされたプロパティは他のメディア コントロールと統合されており、ブラウザ間の互換性が可能です。
構文
JavaScript での HTML DOM オーディオのミュート プロパティの構文は次のとおりです。
selectedObj.muted = 真実 | 間違い
どこ ' 選択されたオブジェクト 」は、音声がミュートされる任意の音声ファイルです。このプロパティには次の 2 つの値のみを保存できます。 真実 ' または ' 間違い ”。このプロパティが true に設定されている場合、オーディオ ファイルはミュートされ、その逆も同様です。
それでは、HTML DOM をより深く理解するために、いくつかの例を見てみましょう。 ミュートされた ' 財産。
例 1: オーディオ ファイルをミュートする
この例では、選択したファイルは「」を使用してミュートされます。 ミュートされた ' 財産。たとえば、以下のコード ブロックにアクセスしてください。
< ディビジョン >< h2 スタイル = 「色: シーグリーン;」 > DOM オーディオのミュート プロパティ h2 >< br >
< オーディオ ID = 「デモオーディオ」 コントロール >
< ソース 送信元 = 「オーディオ.mp3」 タイプ = 「オーディオ/mpeg」 >
オーディオ >
< br >
< ボタン クリック時 = 「ミュートセッター()」 > ミュートに設定する ボタン >
ディビジョン >
< 脚本 >
させて c = document.getElementById ( 「デモオーディオ」 ) ;
関数 ミュートセッター ( ) {
c.ミュート = 真実 ;
警告 ( 「ミュートに成功しました！」 )
}
脚本 >
コードの説明:
-
- まずは親「 ディビジョン ” を含む要素が作成されます。 <音声> ID が「」のタグ デモオーディオ ”。この要素には 1 つの「」が含まれています。 ソース 」要素には、選択したオーディオ ファイルのアドレスとその種類が含まれます。
- 次に、「」を呼び出すボタンが作成されます。 ミュートセッター() ”機能を使用して” クリック時 」イベントリスナー。
- 次に、「」を入力します。 <スクリプト> ” タグを作成し、「audio」要素の参照を「」という名前の変数に格納します。 c ”。
- その後、「 ミュートセッター() 」関数は、「」の値を設定するために作成されます。 ミュートされた 「プロパティを」に 真実 ”。これにより、音声がミュートに設定され、それに応じて警告ボックスにメッセージが表示されます。
コンパイル後:
上の gif は、muted プロパティを使用してオーディオがミュートされていることを示しています。
例: Muted プロパティを使用してオーディオをミュートおよびミュート解除する
この例では、選択したオーディオ ファイルがミュートまたはミュート解除され、現在のステータスが「」を利用して取得されます。 ミュートされた ' 財産。たとえば、以下のコードにアクセスしてください。
< ディビジョン >< オーディオ ID = 「デモオーディオ」 コントロール >
< ソース 送信元 = 「オーディオ.mp3」 タイプ = 「オーディオ/mpeg」 >
オーディオ >< br >
< ボタン クリック時 = 'ミュート（）' > 音声をミュートする ボタン >
< ボタン クリック時 = 'unMute()' > オーディオのミュートを解除する ボタン >
< ボタン クリック時 = 「ミュートステータス()」 > ミュート状態 ボタン >
ディビジョン >
< 脚本 >
var z = document.getElementById ( 「デモオーディオ」 ) ;
関数 ミュート ( ) {
z.ミュート = 真実 ;
}
関数 unMute ( ) {
z.ミュート = 間違い ;
}
関数 ミュート状態 ( ) {
警告 ( z.ミュート ) ;
}
脚本 >
上記のコードの説明は次のとおりです。
-
- まず、HTML を利用して音声ファイルを Web ページに挿入します。 <音声> ' そして ' <ソース> 』タグ。
- 次に、「」という名前の関数を呼び出す 3 つのボタンが作成されます。 ミュート（） ”、” unMute() '、 そして ' ミュートステータス() ”。これらの関数は、ユーザーが対応するボタンをクリックすると呼び出されます。
- 次に、「」に true と false の値を設定してこれらの関数を定義します。 ミュート（） ' そして ' unMute() ' 機能。のために ' ミュートステータス() 」機能を付ける場合は、「」を取り付けるだけです。 ミュートされた 」プロパティをオーディオ参照とともに使用して、ミュートプロパティの現在のステータスを取得します。
コンパイル後の出力は次のようになります。
出力には、オーディオ ファイルがミュートまたはミュート解除されており、そのステータスも「 ミュートされた ' 財産。
結論
HTML DOM オーディオのミュート プロパティは、最初に HTML を使用して Web ページにオーディオ ファイルを挿入することで使用されます。 オーディオ ' そして ' ソース 」要素。その後、このオーディオへの参照が JavaScript コード内の変数に保存され、「 ミュートされた ”というプロパティが付いています。音声をミュートにするには、このプロパティを「」に設定します。 真実 ' そして ' 間違い 」シナリオのミュートを解除します。このブログでは、DOM オーディオのミュート プロパティの動作プロセスを説明しました。