記事内に広告が含まれています

【ワレコの備忘録】htmlで target=”_blank” と target=”_new” の違い

この記事は約3分で読めます。
スポンサーリンク

ワテの場合、HTML関連の記述方法を良く忘れるので自分用の備忘録。

では、本題に入ろう。

スポンサーリンク
スポンサーリンク

target=”_blank” と target=”_new” の違い

リンクやボタンをクリックすると通常は同じウインドウが上書きされる。

でも、

  • 同じウインドウに開きたい
  • 新しいウインドウに開きたい

を制御するにはどうすれば良いか?と言う疑問を持つだろう。それを制御できるのが

target=”なんちゃら

だ。

このなんちゃらの部分に _blank あるいは _new を記述すると、リンクをクリックした場合に新しいウインドウにそのページが開かれる。

 

_blankの場合の記述方法

<a href="http://www.yahoo.co.jp/" target="_blank">Yahooのサイト</a>
<a href="http://www.google.co.jp/" target="_blank">Googleのサイト</a>

_new の場合の記述方法

<a href="http://www.yahoo.co.jp/" target="_new">Yahooのサイト</a>
<a href="http://www.google.co.jp/" target="_new">Googleのサイト</a>

 

もし target=”なんちゃら” を省略すれば、リンクをクリックすると現在のページがその新しいページに置き換わるデフォルトの動作となる。

_blank も _new も省略したデフォルトの動作

<a href="http://www.yahoo.co.jp/" >Yahooのサイト</a>
<a href="http://www.google.co.jp/" >Googleのサイト</a>

 

 

_blanck と _new の動作の違い

target=”_blank” の例

Yahooのサイト クリックすると新しいウインドウに開く
Googleのサイト クリックすると新しいウインドウに開く

_bkankを使うと毎回新しいウインドウが開かれる。

target=”_new” の例

Yahooのサイト クリックすると新しいウインドウに開く
Googleのサイト クリックすると上で開いたウインドウに上書きする

_new を使うと直前に _new で開いたウインドウを使い回す事が可能だ。

まとめ

_blank や _new を使い分けると使い易いウェブページを作る事が可能だ。

 

スポンサーリンク
コメント募集

この記事に関して何か質問とか補足など有りましたら、このページ下部にあるコメント欄からお知らせ下さい。

HTML
スポンサーリンク
シェアする
warekoをフォローする
スポンサーリンク

コメント