LocationオブジェクトとHistoryオブジェクト

WebページのURL情報（Location）

  • Locationオブジェクトは、WebページのURLを情報としてもつオブジェクトです
  • hrefプロパティの値を変更することで、別のWebページへ移動できます



location.href = 移動先URL;

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>JavaScriptの練習</title>
</head>
<body>
<h1>現在のページ</h1>
<p><button onclick="location.href='http://www.google.co.jp/';">移動する</button></p>
</body>
</html>

Webページの履歴情報（History）

  • Historyオブジェクトは、Webページの閲覧履歴を情報としてもつオブジェクトです
  • backメソッドで１つ前のページに戻ることができます
  • ブラウザの戻るボタンをクリックしたときと同じ挙動です



history.back();

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>JavaScriptの練習</title>
</head>
<body>
<h1>JavaScriptの練習</h1>
<p><button onclick="history.back();">戻る</button></p>
</body>
</html>


  • LocationオブジェクトやHistoryオブジェクトで、ページ間の移動ができる