Как воспроизвести аудио в js

Для добавления элемента на страницу который, воспроизводит и управляет настройками аудиозаписи можно использовать тег <audio>. Путь к файлу задается через атрибут src или вложенный тег <source>. Внутри контейнера <audio> можно написать текст, который будет выводиться в браузерах, не работающих с этим тегом.

Пример:

<audio controls>
  <source src="audio/music.ogg" type="audio/ogg; codecs=vorbis">
  <source src="audio/music.mp3" type="audio/mpeg">
  Тег audio не поддерживается вашим браузером. 
  <a href="audio/music.mp3">Скачайте музыку</a>.
</audio>

Существуют и аудиобиблиотеки Javascript предоставляющие более широкие возможности, например howlerjs

Рассмотрим простой пример:

Исходный HTML файл:

<button onclick="sound.play();">Play</button>

Скрипт для подключения библиотеки Howler:

<!-- Подключаем библиотеку howler через cdn сеть в наш HTML документ -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/howler/2.2.3/howler.js"></script>

<!-- создаем экземпляр объекта Howl и в опции src указываем путь до файла, 
сам файл необходимо разместить рядом с HTML документом -->
<script>
    var sound = new Howl({
      src: ['music.mp3'],
      <!-- Можно, например выставить громкость -->
      volume: 0.5,
      <!-- Включить зацикливание проигрывания файла -->
      loop: true,
    });
</script>
0 0
Познакомьтесь с основами JavaScript бесплатно

Похожие вопросы