JavaScriptで特定のエリアのみを印刷する方法
SPAで特定の箇所のみ印刷したい（canvasとか）という要件があったので以下のように実装してみました。
Pタグを二つ用意しています、idはそれぞれp1,p2です。
ボタンを押すと、p1のエリアのみwindow.print();で印刷されるようにしています。
<script>
function printElement(id) {
var area = document.getElementById(id); // 引数のidの箇所を変数に格納
var htmlDoc = document.body.innerHTML; // bodyのhtmlを退避
document.body.innerHTML = area.innerHTML; // 該当idのhtmlをdobyにつっこむ
window.print(); // 印刷
document.body.innerHTML = htmlDoc; // 退避したbodynohtmlを戻す
}
</script>
~~
<p id="p1"><!-- ここだけ印刷されるようにしたい -->
test1
</p>
<p id="p2">
test2
</p>
<button onClick='printElement("p1")'>ボタン</button>
上記のようにすれば、特定箇所だけ印刷することができました。
KHI入社して退社。今はCONFRAGEで正社員です。関西で140-170/80～120万から受け付けております^^
得意技はJS(ES6),Java,AWSの大体のリソースです
コメントはやさしくお願いいたします^^
座右の銘は、「狭き門より入れ」「願わくは、我に七難八苦を与えたまえ」です^^
コメント