Я долго думал, куда отнести эту статью, то ли к HTML5 , то ли к JavaScript . В конце концов, я решил отнести именно ко второму разделу, так как звуки чаще всего делают при возникновении какого-то события, а это уже относится к скриптам. Таким образом, в этом материале Вы узнаете, как воспроизвести звук на JavaScript .

Воспроизведение звука на JavaScript

Я долго думал, куда отнести эту статью, то ли к HTML5, то ли к JavaScript. В конце концов, я решил отнести именно ко второму разделу, так как звуки чаще всего делают при возникновении какого-то события, а это уже относится к скриптам. Таким образом, в этом материале Вы узнаете, как воспроизвести звук на JavaScript.

Для начала базовая теория. Для добавления аудио на страницу служит тег audio:

<audio src="sound.mp3" autoplay="autoplay"></audio>

Таким образом, можно добавить какую-нибудь фоновую музыку на сайт. Атрибут src отвечает за путь к воспроизводимому файлу, а атрибут autoplay отвечает за автоматическое воспроизведение файла при загрузке страницы. Теперь разберём, как сделать звуковую обработку события на JavaScript. Допустим, будем обрабатывать клик мышью по тексту:

<p>Кликни по этому тексту</p>

Осталось лишь сделать функцию soundClick():

function soundClick() {
  var audio = new Audio(); // Создаём новый элемент Audio
  audio.src = 'click.mp3'; // Указываем путь к звуку "клика"
  audio.autoplay = true; // Автоматически запускаем
}

Таким образом, можно обработать звуком любое возникающее событие на странице. Единственное, что Вы должны чётко понимать - работать это всё будет только в современных браузерах, где есть поддержка HTML5. Впрочем, все используемые на данный момент браузеры (за очень редким исключением), его поддерживают в достаточно высокой степени, поэтому с воспроизведением звуков и музыки через тег audio проблем не возникнет.