Добро пожаловать на портал вебмастеров WebmastersBY
Верстка сайта

Изучаем HTML5: атрибут Download

При использовании в анкоре атрибут download дает указание браузеру скачать ресурс, на который он указывает, а не перейти на него

Изучаем HTML5: атрибут Download

Атрибут Download позволяет вызвать диалог сохранения файлов на компьютер пользователя или мобильное устройство.

Пример:

<a href="htmldoc.html" download>Скачать HTML документ</a>

Как правило, когда мы кликаем на ссылку указывающую на HTML-документ, PDF-файл, файл изображения или другие медиа-файлы, то они просто открываются в браузере. Но если гиперссылка имеет атрибут download, как в приведенном выше примере, то браузер, вместо открытия файла, предложит его сохранить, т.е. также как при указании ссылки на zip или exe файл.

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

Изменение имени файла

Также используя этот атрибут Вы можете изменить фактическое имя файла, задав ему соответствующее значение.

Пример:

<a href="tform5201.pdf" download="visa-application.pdf">Скачать</a>

В приведенном выше примере, когда пользователь кликает по гиперссылке, то PDF-файл под названием "tform5201.pdf" сохраняется под более читабельный и удобный именем "visa-application.pdf".

Определение поддержки атрибута браузером

Так как некоторые браузеры до сих пор не реализовали поддержку атрибута download, то при использовании данного атрибута имеет смысл проверять, имеется ли его поддержка в браузере пользователя:

// Создаем временную гиперссылку
var hyperlink = document.createElement("a");

// Если свойство download не определено
// значит браузер не поддерживает этот атрибут
if (hyperlink.download === undefined) {
    // do stuff
}

Поддержка браузерами

На текущий момент (2014 г.), атрибут download поддерживают последние версии следующих веб-браузеров:

  • Firefox / Firefox для Android
  • Chrome / Chrome для Android
  • Opera / Opera Mobile
  • Android Browser
  • Blackberry Browser

Проверьте эту таблицу поддержки атрибута download на caniuse.com, чтобы увидеть текущее положение дел с поддержкой браузерами. Кроме того, можете ознакомиться со спецификацией атрибута download консорциума W3C.

Комментарии 0

Новый комментарий

Имя:
Для редактирования комментария осталось 10 минут
Комментарии отсутствуют