こんにちは！エンジニアのワカツキです！
今回は、window.closeメソッドなどを使って、ブラウザのウィンドウを閉じる方法を解説します！
- window.closeの使い方
- その他のウィンドウの閉じ方
- window.openの使い方
などについて解説していきます。
window.closeとは
window.closeメソッドは、WEBページをJavaScriptで閉じるために用意されたメソッドです。一般のブラウザの場合は、タブが閉じられます。
「ボタンクリック→子画面表示→項目を入力してから画面を閉じる」といった操作の、閉じるボタンを作るときなどに使います。
それでは、実際に動かしてみましょう！
window.closeの使い方
それでは、実際にwindow.closeメソッドの使い方を解説していきます。
window.closeを使って画面を閉じる方法
ボタンをクリックしたときに画面を閉じるサンプルを用意しました。
<html>
<head>
<meta charset="utf-8">
<title>サンプル</title>
</head>
<body>
<input type="button" onclick="window.close();" value="閉じる">
</body>
</html>
onclick処理の中に、「window.close();」を書くことでボタンクリック時に画面を閉じることができます。
ただし、ブラウザのセキュリティ上禁止されていることが多いため、このメソッドは実際に動かないことがあります。そんな時は以下の方法を試してみてください。
window.openを応用してWEBページを閉じる
window.openは本来、新しいページ（ブラウザでいう新しいタブ）を開くためのメソッドですが、このメソッドを利用して、window.closeに対応していないブラウザでもタブを閉じることができます。
<html>
<head>
<meta charset="utf-8">
<title>サンプル</title>
</head>
<body>
<input type="button" onclick="window.open('','_self').close();" value="閉じる">
</body>
</html>
裏技的な方法ですが、これでwindow.close()に対応していない多くのブラウザで動くはずです。window.closeが使えない場合は、こちらを使いましょう！
また、windows.openについては以下記事で詳しく解説しているので、気になる方は見てみてくださいね！
windowを閉じる/開く際の注意点
- Firefoxなどの一部ブラウザではタブが閉じませんので、注意しましょう
- windowを開く際のwindow.openのオプションは、実行時の挙動がブラウザによって異なるので、必ずどのような結果になるか、確認しておきましょう
まとめ
いかがだったでしょうか！
今回の記事では、window.closeメソッドなどを使って、JavaScriptでタブやウィンドウを操作する方法を解説しました。
作業が完了した画面でユーザーがタブを閉じる手間を省いたり、新しいウィンドウでわかりやすく表示したり、色々なことに活用できますので、覚えておきましょう！
