O HTML5 veio com todas as novas APIs, novos tipos de entrada e atributos para formulários. Como é frequentemente o caso, essas principais adições muitas vezes obscurecem as pequenas atualizações e eu acho que isso é particularmente verdadeiro para o atributo de download.
Como você sabe, existem alguns arquivos que o navegador não faz download automaticamente; imagens, outras páginas da web e, dependendo das configurações do seu navegador, às vezes até PDFs. O atributo de download dá ao navegador uma maneira nativa de fazer o download desses arquivos automaticamente, sem ter que recorrer ao JavaScript. Isso é realmente útil para qualquer aplicativo que lida com o download de imagens, como sites de upload de imagens.
Como o atributo de download não usa scripts de nenhum tipo, é tão simples quanto adicionar o atributo ao seu link:
var a = document.createElement('a');if(typeof a.download != "undefined"){// download attribute is supported}else{// download attribute is not supported}Levando em consideração tudo o que foi adicionado ao HTML5, o atributo download é uma parte muito pequena, mas na minha opinião é um atributo que estava muito atrasado e definitivamente tem seus usos nos aplicativos de hoje, tanto para usabilidade quanto para simplificação.
Você implementou o atributo de download? Quais são seus heróis desconhecidos do HTML5? Deixe-nos saber nos comentários.
Imagem em destaque / miniatura, baixar imagem via Shutterstock.
![]( myFolder / myImage.png "download> Baixar imagem </a></pre></div><p> O que é ótimo sobre esse atributo é que você pode até definir um nome para o arquivo para download, mesmo quando não for o nome do servidor. Isso é ótimo para sites com nomes de arquivos complexos, ou até mesmo imagens criadas dinamicamente, que desejam fornecer um nome de arquivo simples e fácil de usar. Para fornecer um nome, basta adicionar um sinal de igual, seguido do nome que você deseja usar entre aspas, assim: </p><div class=pre-wrap><pre><code class=){kind=link}
![var a = document.createElement('a');if(typeof a.download != "undefined"){// download attribute is supported}else{// download attribute is not supported}]( myFolder / reallyUnnecessarilyLongAndComplicatedFileName.png "download =" myImage "> Baixar imagem</a></pre></div><p> Observe que o navegador adicionará automaticamente a extensão de arquivo correta ao arquivo baixado, portanto, não é necessário incluir isso no valor do atributo. </p><p class=clearrow></p><h2> Suporte de Navegador </h2><p> Atualmente, apenas o Chrome 14+ e o Firefox 20+ são compatíveis com o atributo de download. Por isso, talvez seja necessário usar um JavaScript simples para detectar se o atributo é compatível. Você pode fazer assim: </p><div class=pre-wrap><pre><code class=){kind=link}