假设在这种情况下,我有 4 个名为“.CountThese”的 div,我只想这样做,获取具有该特定类的元素数量,然后多次 append 一个 div “.CountThese”的数量也是如此(在这个案例中是 4 次)
这是 html:
<div class="CountThese"></div>
<div class="CountThese"></div>
<div class="CountThese"></div>
<div class="CountThese"></div>
<div class="appendHere"></div>
结果是这样的:
<div class="CountThese"></div>
<div class="CountThese"></div>
<div class="CountThese"></div>
<div class="CountThese"></div>
<div class="appendHere">
<div class="appendedDIVs"></div>
<div class="appendedDIVs"></div>
<div class="appendedDIVs"></div>
<div class="appendedDIVs"></div>
</div>
到目前为止,我发现你可以像这样计算元素的数量:
function divcount() {
var Count = $('.CountThese').length();
document.write(Count)
}
以为我不一定知道如何使用它..我真的不知道我怎么能用那个数字来 append div 或任何其他与此相关的东西..
如何实现?
最佳答案
您可以使用数组 join()
来避免手动迭代方法如:
$(".appendHere").append(new Array(++n).join('<div class="appendedDivs">New!</div>'));
其中 n 是您要创建的元素的数量。
这比接受的答案更好,因为它只操作 DOM 一次而不是 n
次。
var n = $(".CountThese").length;
$(".appendHere").append(new Array(++n).join('<div class="appendedDivs">New!</div>'));
.CountThese {
display: inline-block;
width: 46px;
height: 50px;
background: royalblue;
}
.appendedDivs {
display: inline-block;
height: 30px;
line-height: 30px;
padding: 5px;
margin-right:5px;
color: gold;
font-weight: bold;
background: dodgerblue;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="CountThese"></div>
<div class="CountThese"></div>
<div class="CountThese"></div>
<div class="CountThese"></div>
<div class="appendHere"></div>
关于jQuery - 追加一个元素特定次数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6313668/