Javascript enregistre les pages Web sous forme d'images à l'aide des compétences html2canvas library_javascript

La première étape consiste à enregistrer la page Web en tant que canevas Canvas, à l'aide de la bibliothèque html2canvas, http://html2canvas.hertzen.com/

html2canvas(document.getElementById("id1"), { 
onrendered: function(canvas) { 
document.getElementById("id2").appendChild(canvas);//生成画布后如何处理，当然可以在新标签打开，在浮层展示等等 
}, 
canvas_id: 'canvas'//通过修改html2canvas源码添加canvas的id 
});

Remarque : le premier paramètre de html2canvas() est la zone où le canevas doit être généré. Si le canevas est généré pour la page Web entière, il s'agit de document.body. Pour le deuxième paramètre, veuillez vous référer au site officiel pour définir les différents attributs du canevas. Bien entendu, vous pouvez modifier le code source pour ajouter les attributs souhaités, comme l'ajout d'un identifiant au canevas.

La deuxième étape consiste à enregistrer la toile générée lors de la première étape sous forme d'image

var canvas = document.getElementById("<span style="font-family: Arial, Helvetica, sans-serif;">canvas"</span><span style="font-family: Arial, Helvetica, sans-serif;">),</span> 
url = canvas.toDataURL();// 
//以下代码为下载此图片功能 
var triggerDownload = $("<a>").attr("href", url).attr("download", "img.png").appendTo("body"); 
triggerDownload[0].click(); 
triggerDownload.remove();

Concentrez-vous simplement sur la méthode toDataURL() ici. Vous pouvez convertir le canevas en URL d'image sous forme de données. Attribuez cette URL à la balise code sont les fonctions de téléchargement dont vous avez besoin.