网页中用到克隆的地方有很多，例如页面滚动到底部时内容动态加载，都可以用克隆来实现。
克隆时一般先把模板单独放出来，并给样式设置为display:none，用jQuery的clone()实现
1 <div class="panel panel-default clone-box"> 2 <div class="panel-heading"> 3 <a href="javascript:;" class="flex"> 4 <div class="panel-title"> 5 <span></span> 6 <img src="img/work2.jpg" class="work1"> 7 </div> 8 </a> 9 </div> 10 <div class="panel-collapse collapse"> 11 <div class="panel-body"> 12 <p>今日已完成</p> 13 <p class="finish-detail"></p> 14 <p>困难或总结</p> 15 <p class="summary">无，如果有可以写！</p> 16 </div> 17 </div> 18 </div>
1 .cone-box{ 2 display:none; 3 }
接下来就是重头戏，jQuery的clone()方法：
1 var clone = $(".clone-box").clone(true); 2 clone.removeClass("clone-box"); 3 $(this).attr("data-dismiss", "modal"); 4 $(‘.weekbao .panel-group‘).prepend(clone);
clone()方法里的true代表克隆的时候连事件也一起克隆。
