gouf/index.html

## index.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title></title>
  </head>
  <body>
    <!-- NOTE: JavaScript 側で、自動再生を有効化するには、一度 Play ボタンをクリックする必要がある -->

    <div>
      <input type="button" id="play" value="Play"/>
    </div>

    <div>
      <audio controls src="https://upload.wikimedia.org/wikipedia/commons/0/0c/Meow_domestic_cat.ogg" id="audio"/>
    </div>
  </body>
</html>

## index.js
// 2つの方法で; 2つの音声を同時再生 (動物の鳴き声)
document.addEventListener('DOMContentLoaded', (_e) => {
  let playButton = document.querySelector('#play')
  playButton.addEventListener('click', (_e) => {
    let audio = new Audio('https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3')
    audio.play()

    //*/
    let audio2 = document.querySelector('#audio')
    audio2.play()
    //*/
  })
})

## references_and_links.md

      
    Raw
  

              references_and_links.md
            
          
メディアおよびウェブ音声 API の自動再生ガイド - ウェブメディア技術 | MDN
HTMLAudioElement: Audio() コンストラクター - Web API | MDN
<audio>: 埋め込み音声要素 - HTML: ハイパーテキストマークアップ言語 | MDN


CodePen : Audio Autoplay Test
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title></title>
	</head>
	<body>
	<!-- NOTE: JavaScript 側で、自動再生を有効化するには、一度 Play ボタンをクリックする必要がある -->

	<div>
	<input type="button" id="play" value="Play"/>
	</div>

	<div>
	<audio controls src="https://upload.wikimedia.org/wikipedia/commons/0/0c/Meow_domestic_cat.ogg" id="audio"/>
	</div>
	</body>
	</html>
	// 2つの方法で; 2つの音声を同時再生 (動物の鳴き声)
	document.addEventListener('DOMContentLoaded', (_e) => {
	let playButton = document.querySelector('#play')
	playButton.addEventListener('click', (_e) => {
	let audio = new Audio('https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3')
	audio.play()

	//*/
	let audio2 = document.querySelector('#audio')
	audio2.play()
	//*/
	})
	})