Window: hashchange event

Use the event name in methods like addEventListener(), or set an event handler property.

addEventListener('hashchange', (event) => { });
onhashchange = (event) => { };

A HashChangeEvent. Inherits from Event.

HashChangeEvent.newURL Read only

The new URL to which the window is navigating.

HashChangeEvent.oldURL Read only

The previous URL from which the window was navigated.

In addition to the Window interface, the event handler property onhashchange is also available on the following targets:

• HTMLBodyElement
• HTMLFrameSetElement
• SVGSVGElement

You can use the hashchange event in an addEventListener method:

window.addEventListener('hashchange', () => {
  console.log('The hash has changed!')
}, false);

Or use the onhashchange event handler property:

function locationHashChanged() {
  if (location.hash === '#cool-feature') {
    console.log("You're visiting a cool feature!");
  }
}

window.onhashchange = locationHashChanged;

• popstate event