Керівництво по атрибуту HTML5 Download

18

Від автора: Атрибут download дозволяє нам примушувати комп’ютер або мобільний пристрій користувача завантажувати медіа файли.

Давайте детальніше познайомимося з атрибутом download в HTML5.

Керівництво по атрибуту HTML5 DownloadКерівництво по атрибуту HTML5 Download

Отже, атрибут download дозволяє нам примушувати комп’ютер або мобільний пристрій користувача завантажувати медіа файли. Наприклад:

Download HTML document

Зазвичай, коли ми ставимо посилання на HTML-документ, PDF, зображення або інші медіа файли, вони відкриваються в браузері, коли користувач переходить по посиланню.

Але якщо гіперпосилання містить атрибут download, такий як у прикладі вище, то браузер полуучает інструкції завантажувати файл, таким же чином, як якщо посилання вказує на файл .zip або .exe.

Керівництво по атрибуту HTML5 Download

Атрибут download відкриє діалог «Зберегти», в браузері Firefox, даючи користувачеві можливість зберегти файл на комп’ютер або мобільний пристрій.

Атрибут download відмінно підходить для PDF-файлів, зображень, відео та аудіо кліпів, та іншого медіа контенту, який би ваші користувачі зберігали на свої пристрої.

Зміна імені файлу

Ви можете змінити ім’я файлу, що завантажується, задавши значення атрибуту download. Наприклад:

Визначення Підтримки Атрибуту Download

Так як, багато браузери досі не реалізували атрибут download, испольование JavaScript для перевірки підтримки браузером, буде мудрим рішенням

// create temporary hyperlink element
var hyperlink = document.createElement(«a»);
// if download property is undefined
// browser doesn’t support the feature
if(hyperlink.download === undefined) {
// do stuff
}

На демо сторінці, якщо атрибут download відсутня в браузері, то показується модальне вікно з повідомленням, що повідомляє користувачеві про відсутність підтримки.

Керівництво по атрибуту HTML5 Download

Safari на даний момент не підтримує атрибут download і модальний інформує про це користувача

Статус реалізації

На момент написання, атрибут download підтримується в останніх версіях наступних браузерів:

Firefox/Firefox для Android

Chrome/Chrome для Android

Mozilla/Opera Mobile

Нативний браузер Android

Нативний браузер Blackberry

Поточний статус реалізації можна переглянути в наступній таблиці на сайті caniuse.com. Також, звіртеся зі специфікацією W3C.