Атрибут download HTML5

Frontend разработка

HTML5 пришел с новыми API, новыми типами ввода и атрибутами для форм. Часто бывает, что крупные дополнения могут заслонять незначительные улучшения, и я думаю, что это особенно верно в случае с атрибутом download.

Как вы знаете, есть некоторые файлы, которые браузер не загружает автоматически: изображения, другие веб-страницы и, в зависимости от настроек в вашем браузере, даже PDF-файлы.

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

Aтрибут download в действии

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

<a href="myFolder/myImage.png" download >Загрузить</a>

Что здорово в этом атрибуте – это то, что вы можете присвоить имя загружаемому файлу, даже если его нет на вашем сервере. Это отлично подходит для сайтов со сложными именами файлов или для динамично создаваемых изображений, которые хотят предоставить простое и удобное для пользователя имя файла. Для того, чтобы указать имя, вы просто добавляете знак равенства, за которым следует имя, которое вы хотите использовать в кавычках. Вот так:

<a href="myFolder/безобразноДлинноеНазваниеФайла.png" download="myImage">Загрузить</a>

Обратите внимание, что браузер автоматически добавит правильное расширение для загруженного файла, так что вам не придется это делать.

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

В настоящее время только Chrome 14+ и Firefox 20+ поддерживают атрибут download, так что вам, возможно, придется использовать JavaScript, чтобы увидеть, что атрибут поддерживается. Вы можете сделать это следующим образом:

var a = document.createElement('a');

if(typeof a.download != "undefined") {
// download attribute is supported
} else {
// download attribute is not supported
}

Заключение

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