先说问题:
在首页新增个保存部分dom截图的功能,但首页加载接口较多,图片跨域加载比较慢,
而htmlcanvas保存截图前会将整个页面渲染一遍,这就导致有些图片没加载完成,dom渲染不然,canvas保存就会延迟四五秒之久
解决方法:增加这个参数
ignoreElements: function(element) {
// 返回 true 表示忽略该图片标签元素(也可以选择忽略其他标签)
return element.tagName === 'IMG' ;
}
elements: document.querySelector(“#id”), 这个参数是限定只渲染当前id的dom,不确定有用没
html2canvas(document.querySelector(“#id”), { elements: document.querySelector(“#id”), width: contW, height: winH, scale: scale, willReadFrequently: true, ignoreElements: function(element) { // 返回 true 表示忽略该图片标签元素(也可以选择忽略其他标签) return element.tagName === 'IMG' ; } }).then(function (canvas) { document.getElementById('saveImg').appendChild(canvas); //canvas.setAttribute('id', 'myCanvas'); dataURL = canvas.toDataURL('image/png'); //写你的代码 });
标签:截图,canvas,element,htmlcanvas,首页,document,id From: https://www.cnblogs.com/zerozq/p/18672647