JavaScriptのhistory.go()メソッドは、ブラウザの履歴内を移動するための便利な機能です。このメソッドを使うことで、ユーザーがブラウザの「戻る」「進む」ボタンを押したような動作を、プログラムから実現できます。
history.go()の基本的な使い方
// 1つ前のページに戻る
history.go(-1);
// 1つ先のページに進む
history.go(1);
// 2つ前のページに戻る
history.go(-2);パラメータの説明
history.go()メソッドは、整数値を引数として受け取ります:
- 負の数:指定した数だけ前のページに戻ります
- 正の数:指定した数だけ次のページに進みます
- 0:現在のページを再読み込みします
よく使用されるショートカットメソッド
history.go()の代わりに、以下のショートカットメソッドも利用できます:
// 1つ前に戻る
history.back();
// 1つ先に進む
history.forward();実装例
// 戻るボタンの実装
const backButton = document.getElementById('backButton');
backButton.addEventListener('click', () => {
history.go(-1);
});
// 進むボタンの実装
const forwardButton = document.getElementById('forwardButton');
forwardButton.addEventListener('click', () => {
history.go(1);
});注意点
1. セキュリティ上の制限により、異なるドメイン間での履歴移動はできません。
2. 履歴が存在しない場合(これ以上戻れない・進めない場合)は、何も起こりません。
3. ブラウザの設定によっては、動作が制限される場合があります。
ブラウザ互換性
history.go()メソッドは、主要なモダンブラウザ(Chrome、Firefox、Safari、Edge)で広くサポートされています。
まとめ
history.go()メソッドは、JavaScriptでブラウザの履歴操作を行う際の基本的な機能です。シンプルな実装で履歴のナビゲーションを実現できる便利なメソッドですが、セキュリティやブラウザの制限には注意が必要です。
実際の開発では、SPAフレームワークのルーティング機能と組み合わせて使用することも多く、ユーザー体験を向上させるための重要な要素となっています。