JavaScript History object


The JavaScript History object contains the list of URL visited by the user and allows us to move back or forward in the history list and also load some url from the history list.

Following is the code for implement History object in JavaScript −

Example

 Live Demo

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .sample {
      font-size: 18px;
      font-weight: 500;
   }
</style>
</head>
<body>
<h1>JavaScript History object</h1>
<div class="sample"></div>
<button class="Btn">CLICK HERE</button>
<h3>
Click on the above button to check our history length
</h3>
<script>
   let sampleEle = document.querySelector(".sample");
   document.querySelector(".Btn").addEventListener("click", () => {
      sampleEle.innerHTML = "Your history length is = " + history.length;
   });
</script>
</body>
</html>

Output

On clicking the ‘CLICK HERE’ button −


Updated on: 11-May-2020

326 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements