Javascript 通过按钮下载图像？

我该怎么做才能让你点击一个按钮，它就能下载页面上的所有图片？图像不是本地存储的，而是通过标签中的直接链接存储在那里的

我想用javascript来做

  document.write('<input type="button" value="Download All Images" onclick="downloadIMG()">');        
    function downloadIMG() {
    // what here to download images?
    }

document.write（“”）；
函数下载img（）{
//这里下载什么图片？
}

您需要使用服务器端脚本，如php、asp等

或者，您的服务器可能允许您通过配置动态更改标头

带有mod_头的Apache解决方案

将可下载的图像放在目录中。在此目录中，创建一个包含以下内容的.htaccess文件：

SetEnvIf Request_URI "([^/]+\.jpg)$" REQUESTED_IMAGE_BASENAME=$1
SetEnvIf Request_URI "([^/]+\.png)$" REQUESTED_IMAGE_BASENAME=$1
Header set Content-Disposition "attachment; filename=\"%{REQUESTED_IMAGE_BASENAME}e\"" env=REQUESTED_IMAGE_BASENAME

测试请求：

HEAD /test/Water%20lilies.jpg HTTP/1.1
Host: localhost
Test Response:

HTTP/1.1 200 OK
Date: Sat, 23 Jul 2011 09:03:52 GMT
Server: Apache/2.2.17 (Win32)
Last-Modified: Thu, 23 Aug 2001 14:00:00 GMT
ETag: "26000000017df3-14752-38c32e813d800"
Accept-Ranges: bytes
Content-Length: 83794
Content-Disposition: attachment; filename="Water lilies.jpg"
Content-Type: image/jpeg

HTML5解决方案

您可以在锚上使用HTML5下载属性：

<a href="http://dummyimage.com/600x400/000/fff.png"
    download>Download this image</a>
<a href="http://dummyimage.com/600x400/000/fff.png"
    download="alternate-filename.png"><img
        src="http://dummyimage.com/150x100/000/fff.png"></a>

---

这里您需要的是一个锚（

---

这还有一个额外的好处，就是不再需要JS了。谢谢你的洞察力。我是web开发领域的新手。你能解释一下为什么它需要服务器端的理论方面吗？正如我在第一篇文章中所说，这些文件甚至不在我的服务器上。所以从技术上讲，它们在别人的服务器上，可能已经为php做好了准备。还有，问题是什么这样做和右键单击并保存之间的区别？很抱歉，我没有什么意义。但是谢谢你的帮助：）事实上，在它的理论上，你应该通过“标题”说浏览器那个文件是什么？我指的是浏览器如何呈现这个文件。通常在apache配置文件中，您应该说“Theese文件夹中充满了php，浏览器可以将其呈现为php”。当你点击一个图片（www.example.com/a.jpg），我们使用的现代浏览器知道现代的图片格式，所以他们会在他们的窗口上显示它，但就像rar一样，他们会强制下载。当您想要强制下载图像时，您应该说浏览器通过标题。正如我所知，js没有头代码。您可以仅设置服务器端语言和html5。这将在新选项卡中打开文件..：/

<a href="link/to/img" download>Download Link</a>