Javascript 将隐藏的DIV另存为画布图像

我使用以下代码将可视图像保存为图像

html2canvas(document.querySelector('.specific'), {
        onrendered: function(canvas) {
        theCanvas = canvas;
        Canvas2Image.saveAsPNG(canvas); 
    }
});

---

是否有任何方法可以保存隐藏的

有一些解决方案，例如显示属性切换，或在隐藏元素内部渲染

解决方案1 快速切换可见性属性

const el = document.querySelector('.specific');
el.style.display = "block"; // or any other property, like opacity, visibility...
html2canvas(el, {...}).then((canvas) => {
   el.style.display = "none";
};

解决方案2 将div（并使其可见）包装在一个不可见的包装中

<div style="position: absolute; opacity: 0; pointer-events:none;">
    <div class="specific"></div>
</div>

---

在html2canvas执行开始时，在呈现之前，您可以在文档中显示html吗？onclone回调何时执行？我试图在onclone（）中打印一个console.log，但它的执行时间较新可能您使用的是一些过时的版本？我已经试过了，效果很好：我用的是旧版本。最新版本有onclone方法。在换了最新的一个之后，它开始工作了

<div style="overflow: hidden; height: 0;">
    <div class="specific"></div>
</div>

html2canvas(document.querySelector('.specific'), {
    onclone: function(doc){
        doc.style.display = 'block';
        // or doc.style.opacity = '1', doc.style.visibility = 'visible' ...
    },
    onrendered: function(canvas) {
        theCanvas = canvas;
        Canvas2Image.saveAsPNG(canvas); 
    }
});