javascript - クラスでdivを数えて位置を返す

Question

以下に示すように、多くの動的に作成された div を含むページがあります。

<div class="open"></div>
<div class="open"></div>
<div class="open"></div>
<div class="open"></div>

要素の位置を取得する方法を探しています (たとえば、要素が最初のインスタンスである場合は、id="1" を割り当てます。要素が 2 番目のインスタンスである場合は、id="2" を割り当てます。

現在、次のjqueryを使用していますが、ここからどこに行けばよいかわからないため、行き詰まっています。

 $(document).ready(function () {
 var numDialogs = $('.open').length; 
});

助言がありますか？

score 4 · Accepted Answer

使用するだけです：

$('div.open').prop('id', function(i){
    return 'openElement' + (i + 1);
});

id数値の s は HTML5 では有効ですが、HTML4 では無効のままであり、CSS セレクターを使用して選択するのが難しいため、意図的にプレフィックス文字列を追加しました。

参考文献:

score 0 · Accepted Answer

マーク、要素をターゲットにして、次のように属性を追加できます。

$('.open').attr('id', numDialogs);

これにより、この場合はすべて 4 になりますが、正しい数値を実装するための実際のロジックと格闘することはあなたに任せます。幸運を。

2 に答える 2