Exploration of non-refresh jump page using HTML5 's history API

The history API in HTML4

History this thing everyone should be not unfamiliar, we often use History.back (-1) to implement the fallback function, the specific properties and methods are as follows:

Property

The number of entries in length history. The history that JavaScript can control is limited to the range that can be reached with the browser's "forward" and "back" keys. This property returns the number of addresses that are included under the "Forward" and "back" two keys.

Method

Back () backward, followed by pressing the "back" key is equivalent.

Forward () forward, followed by pressing the "forward" key is equivalent.

Go () Usage: history.go (x); Go to the specified address in the historical range. If x < 0, then back x address, if x > 0, then advance x address, if x = = 0, then refresh the page now open. History.go (0) is equivalent to Location.reload ().

The history API in HTML5

History.pushstate (data, title [, url]): Adds a record to the top of the history stack; data is passed as a parameter when the Onpopstate event is triggered; title is the page title, and all current browsers ignore this parameter URL is the page address, optional, default is the current page address.

History.replacestate (data, title [, url]): Changes the current history, same as the parameter.

History.state: Used to store data data of the above methods, different browser read and write permissions are not the same.

Reference:

Http://www.clanfei.com/2012/09/1646.html

Http://www.cnblogs.com/tugenhua0707/p/3612488.html

Something:

Actually loading the data or using AJAX. Only the Address bar address can be set dynamically.

Make a point first, follow-up and further use the practice.

Exploration of non-refresh jump page using HTML5 's history API