Javascript History - 5 Methods and 3 Properties (Reference)

Tech:
Javascript
Since:
2 years ago
Views:
9

The javascript history object is used to navigate the browser history. It returns a history object which has 5 methods and 3 properties.

History Properties:

back()

This asynchronous method goes to the previous page in session history.

window.history.back();

forward()

This asynchronous method goes to the next page in session history.

window.history.forward();

go()

Asynchronously loads a page from the session history. Identified by its relative location to the current page.

history.go();
history.go(-1);
history.go(1);

pushState()

Pushes the given data onto the session history stack with the specified title.

var state = { page_id: 1, user_id: 5 };
var title = "";
var url = "PAGE_URL.html";

history.pushState(state, title, url);

replaceState()

Updates the most recent entry on the history stack to have the specified data, title, and, if provided, URL.

var state = { foo: "ID" };
history.pushState(state, "", "PAGE_URL_1.html");

history.replaceState(state, "", "PAGE_URL_2.html");

length

Returns an Integer representing the number of elements in the session history, including the currently loaded page.

var x = window.history.length;
// 1

scrollRestoration

Allows web applications to explicitly set default scroll restoration behavior on history navigation.

var x = window.history.scrollRestoration;
// 'auto'

window.history.scrollRestoration = "manual";

state

Returns an any value representing the state at the top of the history stack. Value is null until the pushState() or replaceState() method is used.

var x = window.history.state;
// null