javascript - JSを使用してHTMLセクションを印刷するにはどうすればよいですか？

Question

html2Canvas.jsを使用してHTML要素をキャンバスに変換してからキャンバスを画像に変換すると、ブラウザで印刷できるようになります。これは、HTMLを印刷するための正しいアプローチですか？どのプリンタでも同様の印刷を行うには、画像が最適だと思います。

Answer 1

印刷にはJavaScript関数を使用できます

<div onlick='window.print()'>Print</div>

Answer 2

このコードを CSS に追加すると、次のようになります。

.toPrint {
  display:none;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
}

@media print {
   * {
    display: none !important;
  }

  .toPrint {
    display: block !important;
  }

}

印刷ビューを更新する場合は、次のコードを使用します。

/** code borrowed from @MicrosoftGoogle */
var canvas = document.getElementById("mycanvas");
var img    = canvas.toDataURL("image/png");

if (document.getElementsByClassName("toPrint")) {
  document.getElementsByClassName("toPrint")[0].src = img;
else
  document.write('<img class="toPrint" src="'+img+'"/>');