In the given html, how can I tell that a dom element is a standard html component defined by the browser or a web component defined in a script (by an author):
<div></div>
<custom-web-component></custom-web-component>
I know that there is no way to check programmatically if a web component was already registered. Also they are both considered HTMLElement
. Is there a way to check that a dom node is standard html or custom web component? Let's asume I get the dom element using querySelector()
See Supersharp's answer, customElements.get
is clearly the better way to do this than the below.
A custom element's name is required to contain a -
, whereas an HTML-defined element will not. So:
if (theElement.tagName.includes("-")) {
// It's custom
} else {
// It isn't
}
(Or .indexOf("-") != -1
for older browsers that don't have String#includes
yet.)