aタグのtarget属性でリンク先を別タブで開く方法
Webページを制作する際、リンクをクリックすると新しいタブで開くようにしたい場合があります。この記事では、HTMLのaタグのtarget属性を使って、リンク先を新しいタブで開く方法について解説します。
target属性とは
target属性は、aタグ（アンカータグ）で使用される属性の一つで、リンク先のページをどのように開くかを指定します。target属性にはいくつかの値を設定できますが、ここでは代表的なものを紹介します。
| 値 | 説明 |
|---|---|
_self |
リンク先を現在のタブで開きます。（デフォルト） |
_blank |
リンク先を新しいタブで開きます。 |
_parent |
リンク先を親フレームセットに開きます。フレームセットを使用していない場合は、_selfと同じ動作をします。 |
_top |
リンク先を最上位のフレームセットに開きます。フレームセットを使用していない場合は、_selfと同じ動作をします。 |
新しいタブで開く方法
リンク先を新しいタブで開くには、target属性に_blankを指定します。
<a href="https://www.example.com/" target="_blank">新しいタブで開く</a>
このコードを実行すると、「新しいタブで開く」というテキストリンクが表示され、クリックすると指定したURL（https://www.example.com/）が新しいタブで開きます。
注意点
target="_blank"を使用する場合、セキュリティ上の理由からrel="noopener"属性も合わせて指定することを推奨します。これは、新しいタブで開かれたページが、元のページに対してJavaScript経由でアクセスすることを防ぐための対策です。
<a href="https://www.example.com/" target="_blank" rel="noopener">新しいタブで開く</a>
参考資料
よくある質問
Q1: target属性を指定しても新しいタブで開かない場合は？
A1: ブラウザの設定によって、新しいタブで開かない場合があります。ブラウザの設定を確認し、新しいタブで開くように設定してください。
Q2: target属性はすべてのブラウザで動作しますか？
A2: はい、target属性は主要なブラウザでサポートされています。
Q3: target属性をJavaScriptで動的に変更できますか？
A3: はい、JavaScriptを使ってtarget属性の値を動的に変更できます。例えば、ユーザーの操作に応じてリンク先の開き方を変えることができます。
その他の参考記事:jquery target blank