Question

我无法理解这个术语，以便了解如何做到这一点。在我的页面上，我有许多带有“z-title”类的span元素。我想为这些元素添加一个附加类，其中包括一个增量编号，例如

来自这个

<span class="z-title">Hello</span>
<span class="z-title">Hello</span>
<span class="z-title">Hello</span>

到这个

<span class="z-title tab1">Hello</span>
<span class="z-title tab2">Hello</span>
<span class="z-title tab3">Hello</span>

感谢您的帮助！

Answer 1

jQuery的.addClass() function可以接受回调函数作为参数，在这种情况下，将在jQuery对象中为每个元素调用一次回调。回调接收当前元素的索引作为参数，并且从回调返回的字符串值应该是要添加到该元素的类的名称。

元素索引从零开始，但当然你可以为每个索引添加一个以获得你想要的类名：

$(".z-title").addClass(function(i) { return "tab" + (i + 1) })

.tab1 { color: red; }
.tab2 { color: blue; }
.tab3 { color: green; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<span class="z-title">Hello</span>
<span class="z-title">Hello</span>
<span class="z-title">Hello</span>

Answer 2

你可以使用jQuery每个函数循环遍历所有带有类名称的元素＆＃34; z-title＆＃34;并通过递增索引值为其添加类，代码如下：

 $(".z-title").each(function(index){
    $(this).addClass('tab'+(index+1));
  })

使用jQuery逐步向具有相同类名的所有元素添加数字

2 个答案: