Как добавить прогрессивные идентификаторы к элементам с помощью jquery?

Question

Используя jquery, я хочу добавить идентификатор в серию div, но, конечно, идентификаторы всегда должны быть разными, поэтому я подумал, что у меня должно быть прогрессивное число, например id = "1", id = "2", id= "3" и т. Д.

вот моя разметка:

content

    <div class="box">
        <p>
            content
        </p>
    </div>
    <div class="box">
        <p>
            content
        </p>
    </div>
    <div class="box">
        <p>
            content
        </p>
    </div>

Я пробовал цикл .each (), но не знаю, что передатьколлекция (возможно, $ ('. box'). lenght ()? но возвращает число, а не коллекцию) и как реализовать функцию обратного вызова.любая помощь, пожалуйста?

Заранее спасибо:)

Мауро

Answer 1

.attr() принимает функции

$(".box").attr('id', function(i) {
    return 'div_' + i;
});

Answer 2

Вы можете использовать .each() следующим образом:

$(".box").each(function(i, div) {
  div.id = "div" + (i+1); //i starts at 0
});

Идентификаторы не могут начинаться с цифры, во всяком случае, в HTML4, поэтому я добавил префикс выше.Функция обратного вызова .each() получает индекс и элемент в качестве аргументов, на основе 0, поэтому добавьте 1, если хотите, чтобы оно начиналось с 1.

Вы можете проверить это здесь .