js把html转换成图片格式的方法:首先利用html2canvas把html转换成canvas;然后利用canvas对象方法【toDataURL()】把canvas转换成图片。
本教程操作环境:windows7系统、javascript1.8.5版,DELL G3电脑,该方法适用于所有品牌电脑。
js把html转换成图片格式的方法:
1、首先利用html2canvas把html转换成canvas
html2canvas($('#content'),{
onrendered: function(canvas) {
document.body.appendChild(canvas);
}
})
2、利用canvas对象方法:toDataURL()把canvas转换成图片
function convertCanvasToImage(canvas) {
var image = new Image();
image.src = canvas.toDataURL("image/png");
return image;
}
得到的数据格式为:data:image/png;base64…
完整代码如下:
Document
Hello World!
Are you hear me?
save
$(function(){
$('#btnSave').click(function(event) {
html2canvas($('#content'),{
onrendered: function(canvas) {
document.body.appendChild(canvas);
convertCanvasToImage(canvas);
}
})
});
function convertCanvasToImage(canvas) {
var image = new Image();
image.src = canvas.toDataURL("image/png");
document.body.appendChild(image);
return image;
}
})
相关免费学习推荐:javascript视频教程