HTML5 / JS Какой простой способ выбрать правильный источник звука?

Question

Если у вас есть простой невежественный звуковой тег, например:

<audio id="audio45" preload="auto" src="audio.ogg" controls=""></audio>

Вы можете скопировать источник для воспроизведения следующим образом:

var playback = new Audio();
playback.src = document.getElementById('audio45').src;
playback.load();
playback.play();

Это будет работать с Opera, Firefox, Iceweasel, возможно, с Konqueror. Но при хорошей игре в Internet Explorer, Safari и т. Д. Вам понадобится больше источников.

<audio id="audio45" preload="auto" controls="">
  <source src="audio.ogg" type="audio/ogg" />
  <source src="audio.mp3" type="audio/mpeg" />
</audio>

Но при этом audio45.src остается пустым. Как правильно выбрать поддерживаемый источник, выбранный текущим браузером для проигрывателя? Я ищу способ, который можно записать один раз и применить ко всем динамическим вхождениям audio .

Answer 1

Попробуйте document.getElementById('audio45').currentSrc. По состоянию на (черновик) спецификации HTML5:

media.currentSrc

Возвращает адрес текущего медиаресурса.

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

Атрибут currentSrc IDL изначально является пустой строкой. Его значение изменяется алгоритмом выбора ресурса, определенным ниже.

Примечание. Существует два способа указать медиаресурс, атрибут src или исходные элементы. Атрибут переопределяет элементы.

http://dev.w3.org/html5/spec/Overview.html#attr-media-src

Примечание также:

Примечание: динамическое изменение исходного элемента и его атрибута, когда элемент уже вставлен в элемент видео или аудио, не будет иметь никакого эффекта. Чтобы изменить то, что воспроизводится, просто используйте атрибут src на медиа-элементе напрямую, возможно, используя метод canPlayType () для выбора среди доступных ресурсов. Как правило, манипулирование исходными элементами вручную после разбора документа является излишне сложным подходом.

http://dev.w3.org/html5/spec/Overview.html#the-source-element