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));
    }
  },
);