Open In App

HTML DOM onpageshow Event

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

The DOM onpageshow event in HTML occurs upon navigating a webpage by the user. The onload event does not happen when the page is loaded from the cache and onpageshow event occurs every time the page is loaded otherwise both events are similar.

Supported Tags

  • <body>

Syntax: 

  • In HTML: 
<element onpageshow="myScript">
  • In JavaScript:  
object.onpageshow = function(){myScript};
  • In JavaScript, using the addEventListener() method:  
object.addEventListener("pageshow", myScript); 

Example: Using JavaScript 

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML DOM onpageshow Event
    </title>
</head>
 
<body>
    <h1 id="hID" style="color:green"></h1>
    <h2>HTML DOM onpageshow Event</h2>
   
    <script>
        document.getElementsByTagName(
            "BODY")[0].onpageshow = function () {
                GFGfun()
            };
        function GFGfun() {
            document.getElementById("hID").innerHTML =
                "GeeksforGeeks";
        };
    </script>
</body>
</html>


Output: 

Example: Using the addEventListener() method 

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML DOM onpageshow Event
    </title>
</head>
 
<body>
    <h1 id="hID" style="color:green"></h1>
    <h2>HTML DOM onpageshow Event</h2>
   
    <script>
        window.addEventListener("pageshow", Geeks);
        function Geeks() {
            document.getElementById("hID").innerHTML =
                "GeeksforGeeks";
        }
    </script>
</body>
</html>


Output: 

Supported Browsers: The browsers supported by HTML DOM onpageshow Event are listed below: 

  • Google Chrome
  • Internet Explorer 11.0
  • Firefox
  • Apple Safari 5.0
  • Opera


Last Updated : 15 Jun, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads