如何解决未捕获承诺无法在克隆的 iframe 中找到元素 #2460 我的代码:错误:
我该如何解决这个错误?
我的代码:
const wrapper = document.createElement("div");
const myHTMLString = "<div>Hello</div>";
wrapper.insertAdjacentHTML("afterbegin",myHTMLString);
//console.log(">>>",wrapper);
html2canvas(wrapper,{useCORS: true}).then((canvas) => {
wrapper.appendChild(canvas);
console.log("canvas>>",wrapper.appendChild(canvas));
var base64encodedstring = canvas.toDataURL('image/jpeg',1.0);
console.log("base6",base64encodedstring );
});
错误:
176e275da87 1ms 启动文档克隆
未捕获(承诺)无法在克隆的 iframe 中找到元素
解决方法
html2canvas documentation 说(我用粗体突出显示):
该脚本允许您直接在用户浏览器上截取网页或其部分内容的“屏幕截图”。屏幕截图基于 DOM [...]
脚本遍历加载它的页面的 DOM。它收集那里所有元素的信息,然后使用这些信息来构建页面的表示。换句话说,它实际上并没有截取页面的屏幕截图,而是根据它从 DOM 读取的属性来构建它的表示。
这一切都意味着您传递给 html2canvas
的参数必须是文档中存在的元素。这解释了您遇到的(未捕获的)错误:
无法在克隆的 iframe 中找到元素
显然这个工具会创建一个临时的 iframe
来克隆文档。然后它将搜索您作为参数传递的元素。由于在您的情况下 wrapped
不是文档的一部分,因此此搜索失败。
因此在调用 html2canvas
之前,您可以:
document.body.appendChild(wrapper);
然后,如果您不希望它留在 DOM 中,请在画布渲染完成后立即将其移除。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。