JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptでページを印刷するにはどうすればよいですか?

JavaScriptでページを印刷するには、print()メソッドを使用します。このメソッドを呼び出すと、ブラウザの標準的な印刷ダイアログボックスが開き、どのプリンターを使用するか、部数はいくつにするかといった印刷オプションを簡単に設定できます。

以下は、実際に印刷ダイアログが表示された様子の例です。

JavaScriptでページを印刷するにはどうすればよいですか?

サンプルコード

次のコードを実行すると、ボタンをクリックするだけでページを印刷できる動作を確認できます。

<!DOCTYPE html>
<html>
    <body>
        <button onclick="display()">クリックして印刷</button>
        <script>
            function display() {
                window.print();
            }
        </script>
    </body>
</html>

コードの解説

このコードでは、ボタンがクリックされるとdisplay()関数が呼び出され、その内部でwindow.print()が実行される仕組みです。なお、windowオブジェクトは省略可能なため、単にprint()と記述しても同じ結果になります。

また、印刷時に不要な要素(ボタンやナビゲーションなど)を非表示にしたい場合は、CSSの@media printを活用すると、印刷画面にのみ適用されるスタイルを指定できるため、より実用的な印刷ページを作成できます。

  1. JavaScriptでHTMLページをリダイレクトする方法をわかりやすく解説

    ページリダイレクトとは?あるURLをクリックしてページXにアクセスしたはずなのに、実際には別のページYに移動された——そんな経験はありませんか?これは「ページリダイレクト」と呼ばれる仕組みによるものです。Web開発では、サイト移転時や古いURLから新しいURLへの誘導など、さまざまな場面で活用されています。JavaScriptでリダイレクトを実装するJavaScriptを使えば、クライアント側(ブラウザ側)で非常にシンプルにページリダイレクトを実現できます。特別なライブラリやサーバー側の設定は不要で、window.location.assign()メソッドを呼び出すだけでOKです。訪問者を新し

  2. JavaScriptでWebページをリダイレクトする方法をわかりやすく解説

    Webページを閲覧していると、あるURLをクリックしてページXにアクセスしようとしたのに、実際には別のページYへ移動させられたという経験はありませんか?これは「ページリダイレクト(転送)」と呼ばれる仕組みが働いているためです。JavaScriptを使えば、クライアント側でページリダイレクトを非常に簡単に実装できます。サイト訪問者を新しいページへ誘導したい場合は、<head>セクションに数行のコードを追加するだけで実現可能です。サンプルコード:ボタンクリックでトップページへリダイレクト以下のコードを実行すると、JavaScriptを使ってHTMLページをリダイレクトする方法を実際に確