Я не совсем уверен, какова ваша цель, но давайте все равно начнем с нее.
Страница, на которую вы ссылаетесь, содержит примеры того, как взаимодействовать с аудиоэлементом HTML5 с помощью JavaScript. В зависимости от вашей цели нормального аудио тега HTML5 уже может быть достаточно. См. Также Начало работы с аудиоэлементом HTML5, на который есть ссылка в статье, на которую вы ссылались.
Если мы возьмем пример кода и сделаем снимок экрана с результатом, верхний будет стандартный (зависимый от браузера) проигрыватель аудиотегов HTML5. Страница и сценарий включают в себя все остальные части.
Реальный сценарий состоит в том, что он берет входные данные из HTML-элемента ввода (который содержит файл) и назначает его в качестве источника аудиотега. Статья, на которую вы ссылаетесь, имеет довольно длинное объяснение этому, вы читали это?
Чтобы на самом деле избавиться от прямого отображения, есть несколько вариантов.
- Скрыть ввод с помощью CSS
- Скрыть ввод с помощью JS
- Используйте другой вид элемента или фрагмента кода, чтобы сделать его источником информации о том, какой файл воспроизводить.
Правильный подход, вероятно, будет состоять в том, чтобы использовать часть JS для получения источника вместо фактического HTML-элемента в источнике.
Простым прерывистым решением было бы изменить атрибут типа <input type="text" id="audioFile" value="__file__" size="60" />
на type="hidden"
.
Недостатком было бы то, что вы не можете просто поместить другой файл в поле ввода и позволить ему воспроизвести (вручную).