└── index.html
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | Web Component
8 |
9 |
10 |
11 | Web Component
12 | This is a web component.
13 | © 2023 My Website
14 |
15 |
16 |
17 |
18 |
19 | /* my-component.js */
20 | class MyComponent extends HTMLElement {
21 | constructor() {
22 | super();
23 | this.attachShadow({ mode: 'open' });
24 | this.shadowRoot.innerHTML = `
25 |
28 |
29 |
30 |
31 |
34 | `;
35 | }
36 | }
37 |
38 | customElements.define('my-component', MyComponent);
39 |
--------------------------------------------------------------------------------