手順
以下の二つのファイル
- test.html
- test.js
を作成し、上記ファイルと同一のフォルダに
- music.mp3(適当な曲を用意する)
を配置する
※以下のサンプルは実行すると音楽が再生されるため音量には注意
test.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>JavaScript Sample</title>
<script type="text/javascript" src="test.js"></script>
<script type="text/javascript">document.addEventListener('DOMContentLoaded', function(){main();});</script>
</head>
<body>
</head>
</body>
</html>test.js
var main = function() {
var audioElement = document.createElement('audio');
audioElement.src = 'music.mp3';
audioElement.play();
}説明
Web Audio API の AudioBuffer と AudioBufferSourceNode を利用した再生も可能だが、AudioBuffer が45秒未満を推奨しているのでAudio要素を利用する
MediaElementAudioSourceNode を利用することで Web Audio API と組み合わせることもできる
参考
MDN Web Docs : <audio>: 埋め込み音声要素
MDN Web Docs : document.createElement
MDN Web Docs : AudioBuffer