is=element - カスタマイズドビルトイン要素

• トップ
• HTMLリファレンス
• is=element

属性

<tagName is=dir> - カスタマイズドビルトイン要素

サポート

https://caniuse.com/mdn-html_global_attributes_is

説明

is 属性はカスタマイズドビルトイン要素名を指定します。詳細は「カスタム要素」を参照してください。

使用例

button に対して my-button という要素名を指定しています。my-button は button 要素をベースとしてクリック時にフォントサイズが一瞬だけ 200% となる特殊効果を加えたボタン要素です。

class MyButton extends HTMLButtonElement {
  constructor() {
    super();
    this.addEventListener("click", () => {
      this.style.fontSize = "200%";
      window.setTimeout(() => { this.style.fontSize = "100%"; }, 500);
    });
  }
}
customElements.define("my-button", MyButton, { extends: "button" });

<button is="my-button">Click Me!</button>

リンク

• https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is
• https://developer.mozilla.org/ja/docs/Web/HTML/Global_attributes/is
• https://caniuse.com/mdn-html_global_attributes_is

---