Skip to content
Related Articles

Related Articles

HTML | DOM ontoggle Event

Improve Article
Save Article
Like Article
  • Last Updated : 27 Jul, 2021

The ontoggle event in HTML DOM occurs when the <details> element user opens or closes by the user. The <details> tag is used for the content/information which is initially hidden but could be displayed if the user wishes to see it.

Supported tags



  • In HTML: 
<element ontoggle="Script">
  • In JavaScript: 
object.ontoggle = function(){Script};
  • In JavaScript, using the addEventListener() method: 
object.addEventListener("toggle", Script);



<!DOCTYPE html>
    <title>HTML DOM ontoggle Event</title>
        <h1 style="color:green">GeeksforGeeks</h1>
        <h2>HTML DOM ontoggle Event</h2>
        <details id="detailsID">
            <summary>Show details</summary>
              5th Floor, A-118,
              Sector-136, Noida, Uttar Pradesh - 201305
          "detailsID").addEventListener("toggle", GFGfun);
        function GFGfun() {




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

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


My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!