アンカータグのターゲット属性の_self、_top、および_parentの違い


80

_blankアンカータグを使用すると新しいタブが開くことはわかっています。また、フレームセットを使用するときに使用する自己定義のターゲットもありますが_parent_selfとの違いを知りたいと思い_topます。

回答:


117

これらの答えは良いですが、私見では、それらが質問に完全に対処しているとは思いません。

アンカータグのtarget属性は、アンカーの宛先のターゲットをブラウザに通知します。これらは当初、アンカーを操作してドキュメントのフレームシステムに向けるために作成されました。これは、CSSがHTML開発者の助けになるかなり前のことでした。

これtarget="_self"はブラウザのデフォルトであり、最も一般的なターゲットはtarget="_blank"、新しいウィンドウでアンカーを開くことです(通常、ブラウザの設定によってタブにリダイレクトされます)。"_parent""_top"およびframenameタグはトレンドとしてはiframeサイト構築の日に精通していないものに謎を残しています。

target="_self"これにより、同じフレームにアンカーが開きます。どのような混乱であることは、我々は、一般的にはもうフレームで書かない(およびためということであるframeframesetタグがHTML5で廃止されている)人々は、この同じウィンドウ関数を前提としています。代わりに、このアンカーがフレームにネストされている場合、サンドボックスモードで開きます。つまり、そのフレームでのみ開きます。

target="_parent" それらが互いに内側にネストされている場合、フレームの次のレベルでを開きます

target="_top" これは、ネストされているすべてのフレームの外側に分割され、ブラウザウィンドウでトップドキュメントとしてリンクを開きます。

target="framenameこれは元々非推奨でしたが、HTML5に戻されました。これは、問題の正確なフレームを対象とします。これnameは適切な方法でしたが、その方法はid識別タグの使用に置き換えられました。

<!--Example:-->

<html>
<head>
</head>
<body>
<iframe src="url1" name="A"><p> This my first iframe</p></iframe>
<iframe src="url2" name="B"><p> This my second iframe</p></iframe>
<iframe src="url3" name="C"><p> This my third iframe</p></iframe>

<a href="url4" target="B"></a>
</body>
</html>

16

セクション6.16HTML 4.01仕様のフレームターゲット名は意味を定義していますが、部分的に古くなっています。これは「ウィンドウ」を指しますが、HTML5ドラフトでは、「ブラウジングコンテキスト」についてより現実的に説明しています。これは、最近のブラウザでは、このコンテキストでウィンドウの代わりにタブを使用することが多いためです。

簡単に言うと、_selfはデフォルト(現在のブラウジングコンテキスト、つまり現在のウィンドウまたはタブ)であるため、<base target=...>設定を上書きする場合にのみ役立ちます。この値_parentは、現在のフレームの親であるフレームセットを参照し_topますが、「すべてのフレームから抜け出し」、リンクされたドキュメントをブラウザウィンドウ全体で開きます。


2
w3.org/TR/html-markup/a.html#a.attrs.targetのHTML5ドラフトへのリンクはtarget次のとおりです。
オリバー

16

target="_blank"

新しいウィンドウを開き、関連データを表示します。

target="_self"

同じフレームでウィンドウを開きます。これは、既存のウィンドウ自体を意味します。

target="_top"

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

target="_parent"

親ウィンドウのサイズでデータを開きます。


「全身」とはどういう意味ですか?
robsch 2015年

@robschはJamesJohnsonの回答を参照
Joseph Rex

では、target="_main"属性は何について話しているのでしょうか?
AnupamHaldkar20年

3

これは、異なるターゲット値を持つ画像です。

異なる目標値。1


あなたの「答え」を説明してください。この画像はそれ自体では明確ではありません。
SherylHohman

こんにちは@SherylHohman、私はあなたのフィードバックに感謝します。画像の色がはっきりしないのか、説明がつかないのですか?
ビナヤ

1
私が間違っている場合は私を訂正してください。これは私が画像を見たときの私の理解です:1。_parent-クリックするとフレーム1のリンクがフレーム2で開きます。2. _self-フレーム1のリンクをクリックすると、フレーム1で開きます。3. _blank-ネストされたiframe内にある場合でも、実際にどのフレームにあるかに関係なく、クリックすると新しいタブでリンクが開きます。4. _top-リンクは、ネストされたiframe内にある場合でも、実際にどのフレームにあるかに関係なく、クリックすると現在のタブで開きます。
motss

1

これは、異なるアンカータグの実際的な例です。

ターゲット属性


3
後世のために、リンクされた記事の関連部分をSOにコピーしてください。
トム

リンクのみの応答は、SOの応答とは見なされません。これは有用なコメントの良い例です。回答と見なされるには、リンクされたページの関連情報を投稿に直接埋め込む必要があります。詳細については、SOヘルプページを参照してください。
SherylHohman

リンクはもう利用できません!
RevnicRobert

1
RevnicRobert-ニック@リンク復元した
サイード・マクウッド
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.