# Unknown Elements vs Undefined Custom Elements

{% tabs %}
{% tab title="📘 手冊" %}
* Google ⟩ [Unknown elements vs. undefined custom elements](https://developers.google.com/web/fundamentals/web-components/customelements#unknown)
{% endtab %}

{% tab title="💾 程式" %}
* [replit](https://replit.com/@pegasusroe/unknown-elements-vs-undefined-custom-elements#script.js)
{% endtab %}
{% endtabs %}

{% hint style="warning" %}
注意：

* 沒有 "-" 的標籤 (如：<**nosuchtag**>) 會被視為 **HTMLUnknownElement**，
* 但有 "-" 的標籤 (如：<**undefined-element**>) 會被視為 **HTMLElement**❗️
{% endhint %}

```javascript
const {log} = console;

[
    // <tabs> is an "unknown" element
    tag('tabs') instanceof HTMLUnknownElement,      // true

    // <x-tabs> is an "undefined" custom element
    tag('x-tabs') instanceof HTMLElement,           // true

].forEach(x => log(x));

// helper function
function tag(name){
    return document.createElement(name);
}
```
