a 标签 download 和 target 不配合
发现一个奇怪的事,看代码
<a id="downloadAlink" target="_blank" href="http://www.baidu.com" download="filename.html">下载</a>
理论上,有 download 、target 、href ,在这里点击应该是新开标签下载 href 里东西,然而实际上失败的,也就是说,target 本身的作用确实是给 href 的,并不是给 download 的,download 并不会采用 target 的值,这里,你把 download 去掉,就会正常在新开页面打开 href 链接。
那如果要实现新开窗口下载 href 里东西,那就要手动绑定 click 事件,打开新窗口,下载,例如;
window.onload = () => { let downloadAlink = document.getElementById('downloadAlink'); downloadAlink.onclick = function() { event.preventDefault(); let anotherWin = window.open(), anotherDownloadAlink = this.cloneNode(true); anotherDownloadAlink.style.display = 'none'; anotherWin.document.body.appendChild(anotherDownloadAlink); anotherDownloadAlink.click(); }; };
行文仓促,如有错误,欢迎批评指正~~~
转载请注明来源,文中所提文档可以在我的 Github 上下载~~~新博客现已迁移至 Github issues