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