向div添加一系列数字

Rob*_*Rob 3 html javascript css jquery

我有一个8个div的列表,需要使用Jquery为它们添加一个类序列序列来单独设置它们.需要将它们添加到'content-block'div中,请参阅下面的示例.

期望的效果将是这样的:

<div class="wrapper">
<div id="content-block" *class="post1"*>
</div></div>

<div class="wrapper">
<div id="content-block" *class="post2"*>
</div></div>
Run Code Online (Sandbox Code Playgroud)

我添加了脚本

**Javascript**
$('.post-block').each(function(i){
$(this).addClass('post' + i);})
Run Code Online (Sandbox Code Playgroud)

但我需要将它们与锚链接相关联,因此我需要一种方法来为后块添加ID.

Desired effect
**HTML**
<div id="post1" class="post-block">
</div>

<div id="post2" class="post-block">
</div>
Run Code Online (Sandbox Code Playgroud)

非常感谢

Pet*_*tai 5

jsFiddle例子

首先,您只能在页面上使用一次ID.您可以在页面上多次使用类.

正因为如此我做了content-block一个班,我做你的各种post1,post2... IDS.

下面的函数将遍历在类中具有类的每个元素,并且它将为每个元素添加适当的元素.对于回调函数,您可以使用和作为参数.我创建了一个单独的变量,因为从零开始.content-blockwrapperideach()indexvaluenumindex

each函数中,您也可以使用this而不是value.

jQuery:

$.each($(".wrapper > .content-block"), function(index, value){
    var num = index + 1;
    $(value).attr("id","post"+ num);
});
Run Code Online (Sandbox Code Playgroud)