Using the History API
As part of the HTML5 spec, they are introducing the new history API.
The history API has been around for quite a long time now. It has been used in the past to force the browser to go back to its previous state.
What we couldn’t do with it though was add anything on to the history state. There were workarounds using
location.hash
But location.hash was not built for that purpose. With the new History API there are only three new things you need to know
window.history.pushState(stateObj,title,url)
Add something new on to the history stack. You can pass it anything you want using the stateObj which will then get returned to you on the pop event
window.history.replaceState(stateObj,title,url)
Exactly the same as pushState, but this replaces the current state
window.onpopstate = function(event) { /** do something **/ }
This event is fired off when someone has pressed forward or backward
View Syd Lawrence’s talk on the History API
Please make sure that any time you use AJAX, if you want the content accessible then make the ajax fired on a link and not on other elements!
