History

Syntax#

window.history.pushState(domain, title, path);
window.history.replaceState(domain, title, path);

Parameters#

Parameter	Details
domain	The domain you want to update to
title	The title to update to
path	The path to update to
## Remarks#
The HTML5 History API is not implemented by all browsers and implementations tend to differ between browser vendors. It is currently supported by the following browsers:

Firefox 4+
Google Chrome
Internet Explorer 10+
Safari 5+
iOS 4

If you want to find out more about the History API implementations and methods, please refer to the state of the HTML5 History API.

history.replaceState()

Syntax :

history.replaceState(data, title [, url ])

This method modifies the current history entry instead of creating a new one. Mainly used when we want to update URL of the current history entry.

window.history.replaceState("https://example.ca", "Sample Title", "/example/path.html");

This example replaces the current history, address bar, and page title.

Note this is different from the history.pushState(). Which inserts a new history entry, rather than replacing the current one.

history.pushState()

Syntax :

history.pushState(state object, title, url)

This method allows to ADD histories entries. For more reference, Please have a look on this document : pushState() method

Example :

window.history.pushState("https://example.ca", "Sample Title", "/example/path.html");

This example inserts a new record into the history, address bar, and page title.

Note this is different from the history.replaceState(). Which updates the current history entry, rather than adding a new one.

Load a specific URL from the history list

go() method

The go() method loads a specific URL from the history list. The parameter can either be a number which goes to the URL within the specific position (-1 goes back one page, 1 goes forward one page), or a string. The string must be a partial or full URL, and the function will go to the first URL that matches the string.

Syntax

history.go(number|URL)

Example

Click on the button to go back two pages:

<html>
    <head>
    <script type="text/javascript">
        function goBack()
        {
            window.history.go(-2)
        }
    </script>
    </head>
    <body>    
        <input type="button" value="Go back 2 pages" onclick="goBack()" />    
    </body>
</html>