home ~ projects ~ socials

Web Components Example: Use A Template In The HTML

JavaScript

customElements.define(
  "my-widget",
  class extends HTMLElement {
    constructor() {
      super();
      let template = document.getElementById("my-template");
      let templateContent = template.content;
      const shadowRoot = this.attachShadow({ mode: "open" });
      shadowRoot.appendChild(templateContent.cloneNode(true));
    }
  },
);
-- end of line --