Руководство по атрибуту HTML5 Download

Дата публикации: 2014-09-15

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

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

Итак, атрибут download позволяет нам заставлять компьютер или мобильное устройство пользователя загружать медиа файлы. Например:

<a href="htmldoc.html" download>Download HTML document</a>

1	<a href="htmldoc.html" download>Download HTML document</a>

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

Но если гиперссылка содержит атрибут download, такой как в примере выше, то браузер полуучает инструкции загружать файл, таким же образом, как и если ссылка указывает на файл .zip или .exe.

Атрибут download откроет диалог “Сохранить”, в браузере Firefox, давая пользователю возможность сохранить файл на компьютер или мобильное устройство.

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

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

Вы можете изменить имя загружаемого файла, задав значение атрибуту download. Например:

<a href="tform5201.pdf" download="visa-application.pdf">

1	<a href="tform5201.pdf" download="visa-application.pdf">

Определение Поддержки Атрибута 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
}

// 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 отсутсвует в браузере, то показывается модальное окно с сообщением, говорящим пользователю об отсутствии поддержки.