<p>html2canvas：複製されたドキュメントでDIVを見つけるときにエラーが発生しました</p>

キャンバスをローカルストレージに保存し、React.jsを使用して別のページにリンクしようとすると同じ問題が発生します

<Link to="/system">
            <button className="submitButton"  onClick={this.captureMap} >SUBMIT </button>
</Link>

   captureMap(){
      html2canvas(document.querySelector(".mapboxgl-canvas")).then(canvas => {
        // document.body.appendChild(canvas);
        var image = canvas;
        if(typeof localStorage !== "undefined"){
          localStorage.setItem('mapImg',image.toDataURL());
        }
      });
    }

同じ問題に直面している
const mainDom = document.createElement（ 'div'）;
mainDom.appendChild（domElem [0] .cloneNode（true））; // domElemはいくつかのdomオブジェクトです

mainDomをhtml2canvasに渡すと、以下のエラーが表示されます。

html2canvas：複製されたドキュメントでDIVを見つけるときにエラーが発生しました
demo.html＃/ Demo / Widget：1 Uncaught（in promise）複製されたドキュメントでDIVを見つけるときにエラーが発生しました

@HarishSonar jsfiddleで問題を再現していただけますか？

これは現在修正されています。
domをメモリ内のオブジェクトとして使用できないようです。レンダリングが必要です。
document.getElementsByTagName（ 'BODY'）[0] .append（mainDom）;を追加します。 私の問題を解決しました。

html2canvasが処理されたら、mainDomの削除を処理する必要があります。

将来の訪問者のためだけに、私も同じ問題を抱えています。

最終的にDOMノードのクローンを作成し、それをdocument.bodyの最初の子として挿入し、CSSスタイルposition: absolute; top: -16384px; width: ${originalElementWidth} 。 これは、スクリーンショットとしてキャプチャする前にDOMノードに変更を加える必要がある場合に役立ちます。

また、 @ niklasvh 、まだご覧になりたい場合は、jsfiddleをhttps ：//jsfiddle.net/bLwya8sf/1/

こんにちは、私もこの問題に遭遇しました。 そして、html2canvas関数をトリガーすると、プロジェクト内のすべてのリクエストが送信されます。 解決策を教えていただけますか？どうもありがとうございました。 これは私のコードです：
public downBtn（）{
var targetDom = document.querySelector（ '＃Box'）;
var copyDom = targetDom.cloneNode（true）;
document.body.appendChild（copyDom）;
html2canvas（copyDom）.then（canvas => {
var imgData = canvas.toDataURL（ 'image / jpeg'）;
var img = new Image（）;
img.src = imgData;
img.onload = function（）{
pdf.addImage（imgData、 'jpeg'、0、0、this.width * 0.225、this.height * 0.225）;
pdf.save（ 'pdf_2.pdf'）;
};
copyDom.remove（）;
}）;

ここで同じ問題：この問題を回避するために、SVGをdivにラップする必要がありました...

ここで同じ問題：この問題を回避するために、SVGをdivにラップする必要がありました...

それを行う方法について話すことができますか？

これは現在修正されています。
domをメモリ内のオブジェクトとして使用できないようです。レンダリングが必要です。
document.getElementsByTagName（ 'BODY'）[0] .append（mainDom）;を追加します。 私の問題を解決しました。

html2canvasが処理されたら、mainDomの削除を処理する必要があります。

はい、メモリ内のオブジェクトとしてdomを操作するのではなく、レンダリングされた要素を操作する必要があります

ここで同じ問題：この問題を回避するために、SVGをdivにラップする必要がありました...

それを行う方法について話すことができますか？

もちろん！
ここに例を示しました。
これは、Internet Explorer 11を除いて、すべてのブラウザで罰金を動作します：html2canvasアプローチは知らない...最終PDFで何かをレンダリングしていない場合html2canvasの問題やそのjsPDFの1 ...任意のヒント？
ありがとうございました

これは現在修正されています。
domをメモリ内のオブジェクトとして使用できないようです。レンダリングが必要です。
document.getElementsByTagName（ 'BODY'）[0] .append（mainDom）;を追加します。 私の問題を解決しました。
html2canvasが処理されたら、mainDomの削除を処理する必要があります。

はい、メモリ内のオブジェクトとしてdomを操作するのではなく、レンダリングされた要素を操作する必要があります

oncloneコールバックを使用してみませんか？ これにより、レンダリングする前にdocumentCloneを操作して、変更を加えることができます。
たとえば、スクロール可能なテーブルであるガントチャートがあり、非表示の行がPDFで表示された状態でテーブル全体を印刷するとします。

html2canvas(document.body, {
        onclone: function(documentClone) {
            // target elements you want to change on the "documentClone" object
        })
        .then(function(canvas) {
            // print canvas with e.g: jsPDF
        });
    };

ここでIE11を解決しまし