如何利用jQuery封装一个简单的button组件

前端开发组件化是一个趋势，也方便组件的复用。那么如何利用jQuery封装一个组件呢？就像jQuery UI那样，如何封装专属自己的UI组件呢？ 文件目录： index.html index.js index.css index.js class Button { static initial(selector, value) { $(selector).append( ` ` ); $(`${selector} .jq-button`).click(function(e) { console.log(`${value} button is clicked`); }); }; } index.css .jq-button{ width: 80px; height: 40px; border-radius:10%; margin: 5px; } index.html 运行结果 利用这种方式封装组件，我们会发现一些问题，就是css样式是全局的，且需要添加一个没必要的标签，仅仅作为一个父标签，在其中添加内容而已。不过利用jQ封装组件貌似就是这样子的吧，不知道利用jQuery封装组件有没有更好的解决方案~

本文章由javascript技术分享原创和收集