Javascript Audio object vs. HTML5 Audio tag

В проекте недавно, когда я загрузил звук с помощью

var myAudio = new Audio("myAudio.mp3");
myAudio.play();

Он играл отлично, если не был открыт диалог (т.е. предупреждение, подтверждение). Однако, когда я вместо этого пытался добавить звуковой тег в свой html

<audio id="audio1">
    <source src="alarm.mp3" type="audio/mpeg" />
</audio>

и используя

var myAudio1 = document.getElementById("audio1");
myAudio1.play()

он продолжал играть после открытия диалога. Кто-нибудь знает, почему это? Также, в общем, каковы различия между двумя способами воспроизведения звуков?

Ответы

Ответ 1

В соответствии с эта запись в вики в Mozilla <audio> и new Audio() должна быть такой же, но не похоже, что это случай на практике. Всякий раз, когда мне нужно создать аудиообъект в JavaScript, я просто создаю элемент <audio> следующим образом:

var audio = document.createElement('audio');

Это фактически создает аудио-элемент, который можно использовать точно так же, как элемент <audio>, который был объявлен на странице HTML.

Чтобы воссоздать ваш пример с помощью этой техники, вы бы это сделали:

var audio = document.createElement('audio');
audio.src = 'alarm.mp3'
audio.play();

Ответ 2

JavaScript останавливается во время предупреждения или подтверждения.

Вы не можете одновременно запускать код и отображать alert(), confirm() или prompt(), он буквально ждет ввода пользователя на этом, это основная особенность JavaScript.

Я предполагаю, что именно поэтому звуковой файл, полностью воспроизводимый в пределах JavaScript, делает это. Сравнительно видеоролики Flash или аудио/видео HTML5 будут продолжать воспроизводиться, даже если открыто предупреждение/подтверждение/приглашение JavaScript.

Что касается того, какой метод лучше, хорошо, что зависит от вас. Это довольно архаично, чтобы сделать что-либо с JavaScript, встроенным в alert/confirm/prompt больше, есть способы лучше выглядящие подсказки, которые вы можете сделать с помощью jQuery UI и т.д.

Если у вас много динамического контента на странице или вы просматриваете фоновый буферизирующий звук перед тем, как их нужно запускать, и так далее, тогда JavaScript, вероятно, является более здравым способом, чтобы идти о вещах.

Если у вас буквально только один игрок на экране, нет никаких оправданий для того, чтобы не вставлять код HTML. Несмотря на то, что в наши дни вряд ли кто-то повлияет на кого-то, по-прежнему плохая практика сильно зависит от JavaScript, когда нет оснований.

Ответ 3

Если вы создадите - тогда у вас будут проблемы с ios, потому что он показывает даже вы установили ширину: 0px