一个简单的插件示例，大概功能是点击添加，会增加一块元素，每块元素对应一个删除按钮，点击删除可删除当前的这块html，这个功能一般后台会用到比较多，这里只是简单演示，没有样式美化，凑合看吧，主要是简单演示一下插件写法
html区域:
<div id="parent">
<div class="son">
<div style="width: 300px;height: 100px;border: 1px solid"><input type="text"></div>
<button class="del">删除</button>
</div>
</div>
<button id="add" >添加</button>
依赖jq，所以需要引入jq:
<script src="jquery-3.2.1.min.js"></script>
插件内容:
(function($){
$.add_demo=function(config){
if(!config.parent || !config.son || !config.add || !config.del){
alert('缺少必要参数或参数值不正确');
return;
};
add(config);
del(config);
};
//删除元素
function del(config){
$(config.del).click(function(){
$(this).parent(config.son).remove();
});
};
//添加元素
function add(config){
var son_html=$(config.parent).find(config.son+':last').prop("outerHTML");
if(config.son_html) son_html=config.son_html;
$(config.add).click(function(){
if(!son_html){
alert('没有添加的元素');
return;
}
$(config.parent).append(son_html);
del(config);
});
};
})(jQuery)
调用示例：
$.add_demo({
parent:'#parent', //父元素
son:'.son', //子元素
add:'#add', //添加按钮
del:'.del', //删除按钮\
son_html:'' //子元素html
});
微信