JS实现div模块的截图并下载功能(2)
解释说明:这里核心截图代码是
html2canvas(dom, { onrendered: function(canvas) {})
方法,是插件提供的。其中:dom是你要截图的元素模块
它的作用是把这个参数canvas形成一个img图片元素。调用的是单另的convertCanvasToImage()
方法,
其中: image.src = canvas.toDataURL("image/png");
这句就是生成图片的地址。而这个图片就是截取的你的那个元素,有了图片地址就很好办了。我只是把它添加到id=“dw”这个元素中提供展示效果。其实做到这样就够了,但我又用canvas装了一遍。
后面给图片加载方法:onload ()在其中添加属性撒的,自动执行下载方法:区分了ie浏览器(网上找的方法),还有我直接生成的下载方法。关于下载方法很多,你们随意选。
当然自己的这个download(src)下载方法同样适用ie。因为原理很简单,就是用生成个元素自己调用方法。
总结
以上所述是小编给大家介绍的S实现div模块的截图并下载功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对黑区网络网站的支持!