HTML | DOM Menu Object

The DOM Menu Object is used to represent an HTML <menu> element. This tag defines a list of commands. It is used for context menus, toolbars and for listing form controls and commands.

Syntax:

Accessing Menu Object

var y = document.getElementById("myMenu");

Creating Menu Object
```
var y = document.createElement("MENU");
```

Properties:

label: It sets or returns the value of label attribute of the menu.
type: It sets or returns the value of type attribute of the menu.

Examples-1: Accessing Menu Object.

<!DOCTYPE html> 

<html> 

<body> 

    <div style="background:green; 

                padding: 10px;" 

         contextmenu="MENU"> 

        <p>Right-click inside the box  

          to see the context menu!!!</p> 

        <menu type="context" 

              id="MENU"> 

            <menuitem label="Refresh" 

                      onclick="window.location.reload();"

                      icon="ico_reload.png"> 

          </menuitem> 

            <menuitem label="Email This Page" 

                      onclick="window.location= 

                         'mailto:?body='

                               +window.location.href;"> 

          </menuitem> 

        </menu> 

    </div> 

    <script> 

        function Geeks() { 

            var y = document.getElementById("MENU"); 

        } 

    </script> 

    <p>This example can work only on Firefox!</p> 

</body> 

</html>

Output:

Example-2: Creating Menu Object.

<!DOCTYPE html> 

<html> 

<body> 

    <div style="background:pink; 

                padding: 10px;" 

         contextmenu="MENU"> 

        <p>Right-click inside the box  

          to see the context menu!!!</p> 

        <menu type="context"

              id="MENU"> 

            <menuitem label="Refresh"

                      onclick="window.location.reload();"

                      icon="ico_reload.png"> 

          </menuitem> 

            <menuitem label="Email This Page"

                      onclick="window.location= 

                               'mailto:?body='

                               +window.location.href;"> 

          </menuitem> 

        </menu> 

    </div> 

    <script> 

        function Geeks() { 

           //creating menu 

            var y =  

                document.createElement("MENU");  

            document.getElementById("MENU"); 

        } 

    </script> 

    <p>This example can work only on Firefox!</p> 

</body> 

</html>

Output:

Note: The

element is currently NOT supported in any of the major browsers.

Browsers Supported:

Mozilla Firefox-8.0

Article Tags :

HTML

Web Technologies

HTML-DOM