onpageshow event
The onpageshow event triggers a script when the page becomes visible after being loaded or navigated to. It is commonly used to manage cached pages or refresh content.
Syntax
In HTML
<element onpageshow="myScript">
In JS
object.onpageshow = function(){myScript};
In JavaScript, the addEventListener() function is used.
object.addEventListener("pageshow", myScript);
Example
<!DOCTYPE html>
<html>
<body onpageshow="myFunction()">
<h1>Hello World!</h1>
<script>
function myFunction() {
alert("Welcome!");
}
</script>
</body>
</html>
Values
Conclusion
The onpageshow event is helpful for executing actions when a page is displayed or revisited. It is often used for managing cached content or refreshing the page state. This event ensures a smooth user experience by handling actions when the page becomes visible again.
onpagehide
The onpagehide event is triggered when the user is leaving a webpage. This can happen through various actions, such as clicking a link or closing the browser tab.
onpopstate
The onpopstate event in HTML is triggered when the active history entry changes, enabling developers to handle browser navigation actions such as going back or forward.