SOURCE

// 1. 创建MyButton自定义元素  
class MyButton extends HTMLElement {
    constructor() {
        super();
        this.attachShadow({mode: 'open'});
        this.shadowRoot.innerHTML = `<button><slot>Button</slot></button>`;
    }
}
 // 2. 注册my-button标签,关联到MyButton
customElements.define('my-button', MyButton);

 // 通过JS创建元素
const btn=document.createElement('my-button');
btn.textContent="我的按扭"
btn.addEventListener("click",()=>console.log("点击了"))
document.body.appendChild(btn);

<!-- 通过html直接生成 -->
<my-button>点一下</my-button>
<my-button>自定义按扭</my-button>