HTML | DOM createEvent() Event Method

The createEvent() method in HTML creates an event object of the specified type. The created event must be initialized before use.

Syntax:

document.createEvent( event_type )

event_type: It is the required parameter and used to specify the type of event.

There are many type of events which are listed below:

AnimationEvent
ClipboardEvent
DragEvent
FocusEvent
HashChangeEvent
InputEvent
KeyboardEvent
MouseEvent

PageTransitionEvent
PopStateEvent
ProgressEvent
StorageEvent
TouchEvent
TransitionEvent
UiEvent
WheelEvent

Below program illustrates the createEvent() method in HTML:

Example:

<!DOCTYPE html> 
<html> 
    <head> 
        <title> 
            DOM createEvent() Event Method 
        </title> 
          
        <style> 
            div { 
                padding:50px; 
                text-align:center; 
                background-color: green; 
                color: white; 
            } 
        </style> 
    </head> 
      
    <body> 
        <script> 
            document.body.onclick = function() { 
                document.getElementById("Geeks").innerHTML  
                            = "Welcome to GeeksforGeeks!"; 
            }; 
              
            var onClick = function() { 
                var evt = document.createEvent("MouseEvents"); 
                evt.initMouseEvent 
                    ("click", true, true, window, 0, 0, 0, 0, 
                    0, false, false, false, false, 0, null); 
                document.body.dispatchEvent(evt); 
            } 
              
            onClick(); 
        </script> 
          
        <div id = "Geeks"></div> 
      
    </body> 
</html>                     

Output:
Before Click on the element:

After Click on the element:

Supported Browsers: The browser supported by DOM createEvent() method are listed below:

Google Chrome
Internet Explorer
Firefox
Opera
Safari

My Personal Notes

Recommended Posts: