Всем привет. Вопрос, собственно выше. На сайте есть куча элементов, при клике на которых проигрываются небольшие аудио-файлы,, размером ~30Kb. Используются два варианта:
В первом случае файл подхватывается после клика, и, предполагаю, что у товарищей с медленным соединением, или если файл вдруг будет большой, звук заиграет с задержкой.
// первый вариант
elements.forEach(function(el) {
el.addEventListener('click', function() {
var src = el.dataset.src,
a = new Audio(src);
a.play();
}, false);
});
Во втором случае для каждого элемента создаётся объект, куда толкается и сам элемент и аудио.
// второй вариант
var arr = [];
elements.forEach(function(el) {
var obj = {};
obj.self = el;
obj.audio = (function(path) {
var a = new Audio(path);
a.preload = "auto";
return a;
})(path);
arr.push(obj);
});
arr.forEach(function(el) {
el.self.onclick = function() {
el.audio.play();
};
});
Есть ли смысл этих объектов? И загружается ли аудио-файл, когда он вкладывается в объект? Такие вот вопросы. Спасибо.
