HTML DOM customElements get() method
The customElements get() method returns the constructor used for a previously-defined custom element.
Syntax:
constructor = customElements.get('custom-element-name');Parameters:
- name: The name of the custom element whose constructor you want to return.
Return value: This method returns the constructor for the custom element, or undefined if there is no custom element definition with that name.
Example: In this example, we will define a custom-element and then will get its constructor using this method.
<!DOCTYPE HTML> <html> <head> <title>get() method</title></head> <body style="text-align:center;"> <h1 style="color:green;"> GeeksforGeeks </h1> <p> HTML | customElements get() method </p> <button onclick = "Geeks();"> click here to get constructor </button> <p id="a"> </p> <script> var a = document.getElementById("a"); function Geeks() { class CustomEl extends HTMLElement { constructor() { super() this.attachShadow({ mode: 'open' }) this.shadowRoot.innerHTML = ` <h1 style="color:green;"> GeeksforGeeks Custom Element Data </h1> ` } }window.customElements.define('gfg-custom-element', CustomEl);console.log(customElements.get('gfg-custom-element')); } </script> </body> </html> |
Output:
Before Clicking Button:
After Clicking Button: In the console, the constructor can be seen.
Supported Browsers:
- Google Chrome
- Edge
- Firefox
- Safari
- Opera
.png)
