js能够实现截图吗

JavaScript011

js能够实现截图吗,第1张

一个叫做html2canvas的库,非常棒的一个库,很强大、但用法非常简单.就这么简单的方法,就可以把我的整个页面截图下来了:

function convertHtml2Canvas() { html2canvas(document.body, { allowTaint: false, taintTest: true }).then(function(canvas) { document.body.appendChild(canvas) }).catch(function(e) { console.error('error', e) })}

目前还有一个问题,就是这种方法默认是把整个页面截取下来的(就是说,会以你的innerHeight和innerWidth为边界,会存在大量的空白),可是,我的卡组只是占了页面的一小部分,我只想要卡组的部分啊。其实已经有了canvas就好办了,我们可以对它进行处理啊。大概思路是:1.把上面得到的canvas对象转成Blob并放到一个img元素。然后再把img.src绘制到canvas里面。这时候调用canvas.drawImage方法就可以截取我们想要的内容了。

//先得到图片

var

img=document.getElementById("图片的id")

//得到图片路径

var

path=img.src

//从路径中截取图片名[包括后缀名]

var

filename

if(path.indexOf("/")>0)//如果包含有"/"号

从最后一个"/"号+1的位置开始截取字符串

{

filename=path.substring(path.lastIndexOf("/")+1,path.length)

}

else

{

filename=path

}