Javascriptのブラウザ操作、リロードボタンとページをひとつ戻る/進むボタン

1. リロードボタン

<input type="button" id="reload" value="リロード" />
//リロード
const reloadBtn = document.querySelector("#reload")
reloadBtn.addEventListener("click", function () {
  window.location.reload()
})

location.reload() - 現在の URL をリロード(再読み込み)する。
location.reload(true);のように引数に true を指定するとサーバーからページを再読み込みする(ブラウザキャッシュを無視する)
history.go()または、history.go(0)でも再読み込みが可能。

2. ページをひとつ戻るボタン

<input type="button" id="back" value="戻る" />
//ページをひとつ戻る
const backBtn = document.querySelector("#back")
backBtn.addEventListener("click", function () {
  window.history.back()
})

history.back() - ブラウザ履歴のひとつ前のページに戻る。履歴がない場合は何もしない。history.go(-1)でもひとつ前のページに戻るが可能。

3. ページをひとつ進むボタン

<input type="button" id="forward" value="進む" />
//ページをひとつ進む
const forwardBtn = document.querySelector("#forward")
forwardBtn.addEventListener("click", function () {
  window.history.forward()
})

history.forward() - ブラウザ履歴のひとつ次のページに進む。履歴がない場合は何もしない。
history.go(1)でもひとつ次のページに進むが可能。