Javascript Jquery：解析div块并添加id（1,2,3,4,5）

我试图制作jquery解析div块列表，并用1、2、3、4、5等数字逐个向每个div添加id

例如，下面是div块的列表：

<div class="my-blocks">
   <div class="start"></div>
   <div class="start"></div>
   <div class="start"></div>
   <div class="start"></div>
</div>

类为“start”的div块可以有任意数量。最终结果必须如下所示：

<div class="my-blocks">
   <div id="1" class="start"></div>
   <div id="2" class="start"></div>
   <div id="3" class="start"></div>
   <div id="4" class="start"></div>
</div>

我该怎么做？我真的不知道从何处开始使用此功能。

您可以：

$('.my-blocks .start').each(function(i) {
    $(this).attr('id', i+1);    
});

还请注意，编号无效

id

，您可以使用

div-1

，

div-2

。。。相反

---

您需要为id添加字母前缀，因为在html5以下的标准中，将id设置为数值是不可接受的。这样您的代码就可以实现向后兼容性

尝试使用的接收器功能

---

您必须注意，在HTML4之前，不允许使用以数字开头的id。所以，如果您不使用html5，那么您应该在id中添加一些前缀

尝试：

您可以使用

.each（）

迭代子div，然后使用

索引+1

将其设置为id值。请尝试以下操作：

 $('.my-blocks div').each(function(){
   $(this).attr('id',$(this).index()+1);
 });

---

使用jQuery“id”属性，循环遍历每个块：

$(function(){
    $.each($('.start'), function(i,e){
        e.id = i+1;
    });
});

jshiddle这里

：

$('.start').attr('id', function() { return $(this).index()+1; });

---

您需要动态添加

id

属性的具体原因是什么？在父元素中使用元素索引通常更快、更方便。数字

id

属性在HTML5之前在技术上不受支持，即使在HTML5之后，CSS3仍然不支持它们。添加一个文本前缀会更健壮。谢谢，这正是我需要的！

$(function(){
    $.each($('.start'), function(i,e){
        e.id = i+1;
    });
});

$('.start').attr('id', function() { return $(this).index()+1; });