javascript - 循环遍历一组 id 并复制它们

Question

我有一个无序列表，其 id 如下所示:

<li id="e1">01</li>
<li id="e2">02</li>
<li id="e3">03</li>
<li id="e4" class="event_day">04</li>
<li id="e5" class="event_day">05</li>

还有一个内容如下的 div:

<div id="descriptions">

<div></div>
<div></div>

</div>

我想复制带有 event_day 类的列表项的 id，并将它们分配给末尾带有字母的 div，这样它们就会变成:

<div id="e4d"></div>
<div id="e5d"></div>

我想出了:

$("#descriptions>div").each(function() {
      $(this).attr("id", $(".event_day").attr("id") + "d");
});

但正如您可能会说的那样，它不会循环，而是获取第一个 id 并将其分配给所有 div，从而导致:

<div id="e4d"></div>
<div id="e4d"></div>

如果您能解释逻辑中的缺陷，甚至可能是我可以阅读以提高技能的内容的链接，我将不胜感激。我在看http://docs.jquery.com/Attributes/attr#keyfn但这没有意义。感谢您的阅读!

Answer 1

jquery 中的each 函数还将一个索引参数传递给回调函数。 前提是描述中的 div 数量与类 event_day 的 div 数量相同:

$("#descriptions>div").each(function(n) {
      $(this).attr("id", $(".event_day").eq(n).attr("id") + "d");
});

.eq(n) 返回 jquery 结果集中位置 N 的元素。

不过，您的查询可能会更高效一些，因为现在您要遍历描述中每个 div 的 dom。更好的(恕我直言)是:

var event_days = $("#listIdentifier .event_day");
$("#descriptions>div").each(function(n) {
      $(this).attr("id", event_days.eq(n).attr("id") + "d");
});