Learn ECMAScript - Second Edition

Accessing and modifying history with the history API

You can access a user's history to some level and modify it according to your needs using the history API. It consists of the length and state properties:

console.log(history, history.length, history.state);

The output is as follows:

{length: 4, scrollRestoration: "auto", state: null}4null

In your case, the length could obviously be different depending on how many pages you've visited from that particular tab.

history.state can contain anything you like (we'll come to its use case soon). Before looking at some handy history methods, let us take a look at the window.onpopstate event.