var nub = 2;
var blk="<div class='blk' id=' '></div>";
$("#1").after(blk);
nub++;
怎么让生成出来的div的ID做到blk2 blk3 blk4..... 这样 id=' '里面应该是填写什么
var nub = 2;
var blk="<div class='blk' id=' '></div>";
$("#1").after(blk);
$(".blk:last").attr('id', 'blk'+nub);
nub++;
html
<div class="content"></div>
<span class="btn">点击我</span>
css
html, body{
width: 100%;
height: 100%;
margin: 0;
padding: 0;
text-align: center;
color: #fff;
}
.content{
height: 60%;
background: #00796B;
overflow: scroll;
}
.blk{
height: 20px;
line-height: 20px;
background-color: #B2DFDB;
}
.btn{
display: inline-block;
width: 70px;
height: 30px;
border-radius: 4px;
background: #009688;
line-height: 30px;
margin-top: 30px;
cursor: pointer;
}
js
$(function(){
var add = (function(start){
var count = start;
var iHtml = '';
return function(){
iHtml = "<div class='blk' id="+'blk' + (count++) + ">"+ count +"</div>" + 'blk'+count;
$('.content').append(iHtml);
}
})(1)
$('.btn').click(add);
})
点击预览
闭包搞定,赋初始值,自增
你看一下我的代码https://jsfiddle.net/ksczs3fx/2/
ES6的话可以用模板字符串插入变量,${variable}