最近做在做项目的过程中，需要实现网页截图功能，后来使用的html2canvas来实现案的，而且截图后需要保存图片，我们一起看看如何实现。
方法/步骤
1
在文件夹中创建一个html文件test，把html2canvas也放进去。
2
在test页面中引入html2canvas。
3
创建一个id为“jietu”的div层，作为要被保存的层。
4
然后在其后面添加script脚本，创建一个方法里面使用html2canvas截取jietu层。html2canvas(document.querySelector('#jietu')).then(canvas => { document.body.appendChild(canvas); });
5
执行后我们发现截取的部分以canvas方式显示在后面。
6
现在我们在后面再添加保存图片的方法。 var imgData = canvas.toDataURL('image/png').replace('image/png', 'image/octet-stream'); window.location.href= imgData;
7
这次我们再次在浏览器打开test就可以保存图片了。
下一篇：小马图片设计