【JavaScript】ヒストリーオブジェクト

2020年7月29日 08:46

ヒストリーオブジェクトとは

ひとつ前に見ていたページ、ふたつ前に見ていたページなどの、ウィンドウのヒストリ情報を保持、制御するオブジェクトです。

プログラム例

history    ヒストリーオブジェクト

history.back()

現在のウィンドウのヒストリーを1つ戻す

newW.history.forward()

newWというサブウィンドウのヒストリーを1つ先のページに進める

サンプルプログラム

<html>
<head>
<title>サンプル</title>
</head>
<h2>ヒストリーオブジェクト</h2>
<script language="JavaScript">
<!--

for(i in history) {
   document.write(i + " = " + history[i] + "<br />");
}

//-->
</script>
</body>
</html>

プログラムダウンロード

ヒストリー制御

履歴の「前のページ」や「先のページ」に移動します。
これはユーザーがブラウザの「戻る(←)」「(→)進む」ボタンをクリックした際の動きと同じです。

プログラム例

back       1つの前のページへ
forward  1つの先のページへ

history.back()

1つ前のページに戻る

history.forward()

1つ先のページに進む

history.go(2)

2つの先のページに進む

history.go(3)

3つの先のページに進む

サンプルプログラム

<html>
<head>
<title>サンプル</title>
</head>
<h2>ヒストリー移動</h2>
<input type="button" value="前へ" onclick="history.back()"><br />
<input type="button" value="次へ" onclick="history.forward()"><br />
<input type="button" value="前へ" onclick="history.go(-1)"><br />
</body>
</html>

プログラムダウンロード

ヒストリー総数

ヒストリー(履歴)数を返します。
ウィンドウ上の「戻る」ボタンで表示される履歴の数を返します。

length     ヒストリー数を返します

プログラム例

hLen = history.length

変数hLenに現在のウィンドウのヒストリー数を代入する

サンプルプログラム

<html>
<head>
<title>サンプル</title>
</head>
<h2>ヒストリー数は現在</h2>
<script language="JavaScript">
<!--

document.write(history.length);

//-->
</script>
</body>
</html>

サンプルダウンロード

JavaScriptをもっと学びたい人には！この本がおすすめです！

この記事が気に入ったらサポートをしてみませんか？