怎么用javascript 保存html 页面中的img图片到本地路径

Posted 2023-03-19

img标签 <img id="pic" src="/Img/2.jpg" width="200" height="300" style="border:1px solid #000" onclick="save()"/>
buttton标签 <input type="button" value="保存" onclick="save()"/>
应为我把图片修改了，显示在页面上了，但是需要它另外保存出来放在/Img/loadImg/ 路径里面
我需要执行javascript方法 save()保存，但是这个save()怎么写

给你思路，代码懒得写了。

现在所有的浏览器都支持
document.execCommand方法
而改方法在IE下有个命令叫SaveAs的，如
document.execCommand("SaveAs")
就可以把当前网页的所有内容保存下来，但是有些浏览器不兼容。
所以第一个问题就是解决SaveAs的兼容性，具体自行百度。
解决了这个问题后，那么又会遇到下面的这个问题，SaveAs是保存该网页的所有内容，就相当于你在网页上按Ctrl + S保存网页到本地类似，所以要解决怎么才能只保存图片，思路如下
用代码动态的创建一个iframe，该iframe的url为该图片的URL，然后在该iframe的load事件中调用SaveAs命令。

大致思路就是这样，受之于鱼不如授之予渔，当然你也可以说我懒。 参考技术A function save() 
    window.open(document.querySelector('img').src);