ページの最上部（TOP）に戻るボタン

本日の業務中、

JSで手っ取り早くページ内の最上部（TOP）に戻る処理が必要になったので、メモしておく。

onclickイベントを利用してもいいし、関数として変数に代入しても問題ない。

document.body.scrollTop = document.documentElement.scrollTop = 0;

ただし、こちらの処理は実行されるとアニメーションなしで最上部に戻されます。

ユーザー目線だとページが高速で切り替わっているように見えます。

ついでに、アニメーションを利用するならどうしたらいいかも調べました。

業務では使わなかったけど。

$('html,body').animate({scrollTop: 0}, 300);

数値「0」が高さ0を表し、数値「300」が移動スピードを表しています。

clickイベント

たまにJSを書くと思い出せなくなるものをメモ。

var test = document.getElementById([任意のID]);
test.click();

スクリプト内で特定のタグをクリックした時と同様の挙動をするようにする処理。

本当によく忘れるので。

「target="_blank"」と「target="new"」

の違いを初めて知り、実際に試してみました。

よく利用されているのは「target="_blank"」の方かと思います。

こちらをaタグに追加するだけで新規ウィンドウや新規タブにページが開きます。

書き方
<a href="https://www.google.co.jp/" target="_blank">新規タブが開きます</a>

しかし、

こちらはアンドロイドの端末では新規ウィンドウに切り替わらないようになっているとのこと。

そこで見つけたのが「target="new"」でした。

書き方
<a href="https://www.google.co.jp/" target="new">新規タブが開きます2</a>

こちらは新規ウィンドウが開きそちらへ遷移できます。

しかも、何度クリックしても１度開いたページにのみ遷移します。

アンドロイド端末でも遷移できました！！

ところが、

１度タップして新規ウィンドウを閉じずに戻ってもう１度タップしたら

遷移しない・・・？

どうやらiPhoneはウィンドウを閉じなければ遷移しないようです。

（※新規ウィンドウを閉じたら遷移します）