Почему в моём цикле .each присваивается одинаковое значение атрибута тегам td (JavaScript)?

Question

[EvgenyJozef3000]

Добрый день. Имеется следующий код:

В котором я сперва получаю значения td из первого тега tr:nth-child(1), иду циклом .each по каждому tr и записываю его в переменную title. В этом цикле each я ещё создаю один цикл each, в котором перебираю каждый элемент td в tr:nth-child(2), затем следующим кодом: $(this).attr("aria-label", title); задаю каждому td атрибут aria-label со значением каждого td из первого tr:nth-child(1). При этом, в результате моего скрипта появилось одного и тоже значение атрибута:

А надо, чтобы значения везде были разные, такие же как в td (в первом теге tr:nth-child(1) ).
Подскажите пожалуйста, в чём может быть проблема? Причём, если выводить отдельную переменную title в console, то значения не будут повторяться и будут идти как надо.

Answer 1

[Александр Баранчугов]

Смотри:

$(td1).each(function() {
  title = $(this).text();
  $(td2).each(function() {
    $(this).attr("aria-label", title);
    console.log(title);
  });
});

Здесь у тебя получается цикл в цикле. Работает это так:
- сначала ты берешь первый элемент из коллекции td1, получаешь для него title, во втором цикле для каждого TD из коллекции td2 ты подставляешь в атрибут aria-label значение title
- берешь второй элемент из коллекции td1, получаешь title, подставляешь его в атрибут aria-label элементов коллекции td2
... и т.д. ...

Попробуй так:
Убрать цикл в цикле, для первого цикла получи индекс каждого перебираемого элемента и по индексу ищи элемент TD в коллекции td2

$(td1).each(function( index ) {
  title = $(this).text();
  $(td2).eq(index).attr("aria-label", title);
});

Comments

[EvgenyJozef3000]

Всё работает, благодарю!