Javascript で ページ遷移する

Javascriptを使ってページ遷移する方法。

同一ウィンドウ・同一タブで遷移する

window.location.href = '遷移先URL';

同一ウィンドウ・別タブで表示する

window.open('遷移先URL', '_blank');

別ウィンドウで表示する

window.open('遷移先URL', '_blank', 'スタイル');

別タブのコードに加え、「スタイル」要素を指定すると別タブで開くことができる。
以下にスタイルで使用できるプロパティ一覧を記載する。

スタイル一覧

プロパティ 説明
width 数値(ピクセル) 表示するウィンドウの横幅
height 数値(ピクセル) 表示するウィンドウの高さ
top 数値(ピクセル) ウィンドウの表示位置(画面上から指定値に表示)
left 数値(ピクセル) ウィンドウの表示位置(画面左から指定値に表示)
menubar yes|no メニューバーを表示するか
location yes|no アドレスバーを表示するか
toolbar yes|no ツールバーを表示するか
status yes|no ステータスバーを表示するか
scrollbars yes|no スクロールバーを表示するか
resizable yes|no リサイズできるか

書き方サンプル

window.open('遷移先URL', '_blank', 'width=500,height=500');

投稿者: Output48

中学生の時に初めてHTMLに触れてからホームページ制作を独学で始める。 ベンチャー企業の営業、大手企業のSEを経て、独立。 ここ数年はWEB以外の仕事をしていたため、割と本気で勉強中。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です