Source Code: (back to article)
<body>
<script>
class CustomElement extends HTMLElement {
constructor() {
super();
const shadowRoot = this.attachShadow({ mode: 'open' });
shadowRoot.innerHTML = `
<div class="container">
<slot name="content">Default content</slot>
</div>
`;
}
}
customElements.define('custom-element', CustomElement);
// Displaying the custom element
const customElement = document.createElement('custom-element');
document.body.appendChild(customElement);
</script>
</body>