Horje
HTML onhashchange Attribute

Definition and Usage

The onhashchange attribute fires when there has been changes to the anchor part (begins with a '#' symbol) of the current URL.

An example of what an anchor part actually is: Assume that the current URL is
http://www.example.com/test.htm#part2 - The anchor part of this URL would be #part2.

To invoke this event, you can:

  • Change the anchor part by setting the location.hash or location.href property of the Location Object
  • Navigate to the current page with a different bookmark (Use the "back" or "forward" buttons)
  • Click on a link to a bookmark anchor

Applies to

The onhashchange attribute is part of the Event Attributes, and can be used on the following element:

Elements Event
<body> onhashchange

Browser Support

The numbers in the table specify the first browser version that fully supports the event attribute.


How to Execute a JavaScript when the anchor part has been changed - HTML onhashchange

Click the button to change the anchor part of the current URL to #part5
index.html
Example: HTML
<!DOCTYPE html>
<html>
<body onhashchange="myFunction()">

<p>Click the button to change the anchor part of the current URL to #part5</p>

<button onclick="changePart()">Try it</button>

<p id="demo"></p>

<script>
// Using the location.hash property to change the anchor part
function changePart() {
  location.hash = "part5";
  let x = "The anchor part is now: " + location.hash;
  document.getElementById("demo").innerHTML = x;
}

// Alert some text if there has been changes to the anchor part
function myFunction() {
  alert("The anchor part has changed!");
}
</script>

</body>
</html>





html onhashchange

Type:
Develop
Category:
Web Tutorial
Sub Category:
HTML Attribute
Uploaded by:
Admin


Read Article
https://develop.horje.com/learn/1434/reference