512

HTML プロジェクトに取り組んでいますが、JavaScript を使用せずにリンクを新しいタブで開く方法がわかりません。

<a href="http://www.WEBSITE_NAME.com"></a>同じタブでリンクを開くことはすでに知っています。新しいもので開く方法はありますか?

4

11 に答える 11

816

targetリンクの属性を次のように設定し_blankます。

<a href="#" target="_blank" rel="noopener noreferrer">Link</a>

その他の例については、http ://www.w3schools.com/tags/att_a_target.asp を参照してください。


ノート

使用すると新しいタブが開き、リンクを再度クリックすると同じタブが使用されるため、以前はblank代わりに提案しました。_blankただし、これは、GolezTrol が指摘したように、フレーム/ウィンドウの名前を参照しているためであり、リンクをもう一度押して同じタブで開くときに設定および使用されます。


セキュリティに配慮!

これrel="noopener noreferrer"は、新しく開いたタブが悪意を持って元のタブを変更できないようにするためです。この脆弱性の詳細については、次の記事を参照してください。

于 2013-07-17T22:11:13.067 に答える
119

要件に応じて、これらのいずれかを使用してください。

リンクされたドキュメントを新しいウィンドウまたはタブで開きます。

 <a href="xyz.html" target="_blank"> Link </a>

リンクされたドキュメントをクリックしたときと同じフレームで開きます (これがデフォルトです)。

 <a href="xyz.html" target="_self"> Link </a>

リンクされたドキュメントを親フレームで開きます。

 <a href="xyz.html" target="_parent"> Link </a>

リンクされたドキュメントをウィンドウ全体で開きます。

 <a href="xyz.html" target="_top"> Link </a>

リンクされたドキュメントを名前付きフレームで開きます。

 <a href="xyz.html" target="framename"> Link </a>

MDN を参照

于 2014-07-12T18:55:19.583 に答える
45

リンクごとにコマンドを実行するのではなく、サイト全体に対してコマンドを 1 回実行したい場合。あなたのウェブサイトとビンゴの頭の中でこの場所を試してみてください.

<head>
<title>your text</title>
<base target="_blank" rel="noopener noreferrer">
</head>

お役に立てれば

于 2015-11-05T13:29:40.927 に答える
16

使用target="_blank":

<a href="http://www.example.com/" target="_blank" rel="noopener noreferrer">This will open in a new window!</a>
于 2013-07-17T22:11:40.343 に答える
4

以下を使用できます。

<a href="http://www.WEBSITE_NAME.com"  target="_blank"> Website</a>

ただし、上記により、サイトがフィッシング攻撃に対して脆弱になります。リンクに rel="noopener noreferrer" を追加することで、一部のブラウザーで発生しないようにすることができます。これを追加すると、上記の例は次のようになります。

<a href="http://www.WEBSITE_NAME.com" rel="noopener noreferrer" target="_blank">Website.com</a> 

詳細については、 https ://www.thesitewizard.com/html-tutorial/open-links-in-new-window-or-tab.shtml を ご覧ください。

于 2019-03-02T10:59:48.003 に答える
0

Reactの場合、誰かが新しいタブでリンクを開きたい場合。<a href="/path"></a>ページが新しいルートの一部のテキストまたは画像のみを変更した場合でも、ページ全体を更新するため、react-router-dom から使用してください。リンクの使い方はこちら

于 2021-05-26T11:12:27.120 に答える