JavaScriptでウェブページのタブを閉じたい 【できる場合、できない場合】

JavaScriptでウェブページのタブを閉じるコードは、ブラウザ（あるいはバージョン）によって挙動が違います。ここで検証できます。

セキュリティによる制約がある

まず、基本的にはJavaScriptでは、コードから開いたウィンドウは閉じることができるものの、ユーザーが開いたウィンドウは閉じられません。これは、セキュリティのためです。

つまり、リンクで表示したページの場合、「閉じる」ボタンを作ってタブを閉じることはできない、ということになります。

参考のため、いろいろ試した結果のコードを置いておきます。

このページを新しいタブで開いてみる

ここで、開いたタブなら閉じられる。

【 新しいタブで開く 】

window.closeメソッド

以下、window.closeメソッドの動作を実際に検証してみましょう。

window.close();

以下のコードを実行するボタンのHTML

<input type="button" onclick="window.close();" value="window.close()">

いったんopenしてからcloseする

そこで、一度「空白ページ」として開いてから、閉じるコードがこちら。

window.open('about:blank', '_self').close();

Chromeでは、以下のコードが有効なようです。ただ、これはバグなのでいずれは修正されることが予想されます。

window.open('', '_self').close();

リンクでwindow.closeするパターンは？

ボタンではなく、アンカーリンクで「閉じる」場合も検証してみました。

<a href="javascript:void(0);" onclick="window.close();return false;">
【 閉じる [X] 】
</a>

追記：タグ「a」の属性「href」の URL プロトコルが無効です（2020年9月9日）

アンカーリンクによるボタンはAMPのエラーが表示されたので、いったん削除して画像に差し替えています。

AMP > タグ「a」の属性「href」のURLプロトコルが無効です。