The JavaScript History object - property of the window object - contains an array / list of previously visited URLs. In this article, we will look at the history object properties and methods, length, current, next, previous properties, back(), forward() and go() methods along with syntax and examples.

Mostly, JavaScript history object is used to simulate the browser's back button:

<a href="javascript:history.go(-1)">Go back</a>

window.history

window.history property has the return value as an array which contains items with details of the URL's visited within that browser window/tab. The JavaScript history object is a JavaScript object and not a DOM object. The JavaScript runtime engine automatically creates this object.

window.history Properties

history.length

The length property of the history object returns the number of elements in the history list.

General syntax of length property of history Object:

history.length;

An example to understand the length property of history object:

<script type="text/javascript">
    var numberofvisited = history.length;
    document.write("The number of pages visited
    in this window is" +numberofvisited+ " pages.");
</script>

history.current

This property contains the complete URL of the current History entry.

General syntax of current property of history Object:

history.current;

history.next

The next property of history object contains the complete URL of the next element in the History list. This functionality or the URL visited is the same as pressing the forward button or menu.

General syntax of next property of history Object:

history.next;

history.previous

The previous property of history object contains the complete URL of the previous element in the History list. This functionality or the URL visited is the same as pressing the back button or menu.

General syntax of previous property of history Object:

history.previous;

window.history Methods

history.back()

The back() method of the history object loads the previous URL in the History list. The functionality results are the same as pressing the previous button of the browser.

General syntax of back method of history Object:

history.back();

history.forward()

The forward() method of the history object loads the next URL in the History list. The functionality results are the same as pressing the forward button of the browser.

General syntax of forward method of history Object:

history.forward();

history.go()

If the programmer wishes to load a specified URL from the History list, then the go method of history object can be used.

General syntax of forward method of history Object:

history.go(number);

or

history.go(URL);

The back method seen above is the same as history.go(-1) in terms of go method of history object. The forward method seen above is the same as history.go(1).

Add comment