Skip to content
Related Articles

Related Articles

HTML DOM window customElements property

View Discussion
Improve Article
Save Article
  • Last Updated : 01 Jun, 2022
View Discussion
Improve Article
Save Article

The customElements property returns a reference to a CustomElementRegistry object, which can be further used to register new custom elements and hence get information about previously registered custom elements.


var obj = window.customElements;

Return Value:

  • CustomElementRegistry Object: This property returns an object which contains details about Custom Elements defined.

Example: In this example, we will get information about custom elements and will create a custom element using define() method.


    <title>customElements property</title>
<body style="text-align:center;">
    <h1 style="color:green;"> 
    HTML | customElements property   
    <button onclick = "Geeks();">
    click here
    <p id="arr">
        var arr = document.getElementById("arr");
        function Geeks() {
          let customElementRegistry = window.customElements;
          class CustomTitle extends HTMLElement {
              constructor() {
                this.attachShadow({ mode: 'open' })
                this.shadowRoot.innerHTML = `
                <h1>Newly Defined Custom Element's Data</h1>
                'custom-title', CustomTitle);


Before Button Click:

After Button Click:

customElements object:

Supported Browsers:

  • Google Chrome 54 and above
  • Edge 79 and above
  • Firefox 63 and above
  • Safari 10.1 and above
  • Opera 41 and above
  • Internet Explorer not supported

My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!