HTMLAudioElement: Audio() コンストラクター

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.

Audio() コンストラクターは新しい HTMLAudioElement を作成し返します。この要素は文書に取り付けてユーザーが操作したり聞いたりすることができますし、画面外で音声を管理したり再生したりするために使用することもできます。

構文

js
new Audio()
new Audio(url)

引数

url 省略可

オプションで、新しい audio 要素に関連付ける音声ファイルの URL をの入った文字列。

新しい HTMLAudioElement オブジェクトで、url で指定したファイルの音声を再生するために使用するように構成されています。新しいオブジェクトの preload プロパティは auto に設定され、その src プロパティには指定した URL が入ります。URL が与えられなかったら null が設定されます。 URL が指定された場合、ブラウザーは新しいオブジェクトを返す前に、非同期的にメディアリソースの読み込みを始めます。

使用上の注意

他にも document オブジェクトの createElement() メソッドなど、要素を作成するためのメソッドを使用して、新しい HTMLAudioElement を構築することもできます。

再生を始めるタイミングを決める

音声ファイルが十分に読み込まれ、再生が開始されたことを確認する方法は 3 つあります。

readyState プロパティの値を調べます。HTMLMediaElement.HAVE_FUTURE_DATA であれば、再生を始めるのに十分なデータがあり、少なくとも短時間は再生できます。HTMLMediaElement.HAVE_ENOUGH_DATA であれば、現在のダウンロードレートを指定された場合、音声を中断することなく最後まで再生できる十分なデータがあることを意味します。
canplay イベントを待ち受けします。再生を始めるのに十分な音声が利用できると <audio> 要素に送られますが、中断されることもあります。
canplaythrough イベントを待ち受けします。音声が中断することなく最後まで再生できると推測されるときに送られます。

イベントベースの方法が最適です。

js
myAudioElement.addEventListener("canplaythrough", (event) => {
  /* 権限があれば、音声が再生できるようになった */
  myAudioElement.play();
});

Help improve MDN

Was this page helpful to you?

Yes No

Learn how to contribute

This page was last modified on 2023年6月1日 by MDN contributors.

View this page on GitHub • Report a problem with this content

HTMLAudioElement: Audio() コンストラクター

In this article

構文

引数

返値

使用上の注意

再生を始めるタイミングを決める

メモリーの使用と管理

仕様書

ブラウザーの互換性

関連情報

Help improve MDN