javascript - 将类添加到 div，每个 div 的数字都会增加

Question

我想将一个类“slide-number-x”添加到滑块中每张幻灯片内的元素中，“x”代表 dom 中的幻灯片编号。

因此，例如这个简单的 HTML 标记：

<div class="slider">
    <div class="slide"><div class="slide-title"></div></div>
    <div class="slide"><div class="slide-title"></div></div>
    <div class="slide"><div class="slide-title"></div></div>
    <div class="slide"><div class="slide-title"></div></div>
</div>

会成为：

<div class="slider">
    <div class="slide slide-number-1"><div class="slide-title"></div></div>
    <div class="slide slide-number-2"><div class="slide-title"></div></div>
    <div class="slide slide-number-3"><div class="slide-title"></div></div>
    <div class="slide slide-number-4"><div class="slide-title"></div></div>
</div>

我认为这会起作用：

$('.slide').each(function(i){
  $(this).addClass('slide-number'i+1);
});

有什么帮助或想法吗？

非常感谢，

Answer 1

您忘记了连接运算符 ( +)，请使用：

$('.slide').each(function(i){
  $(this).addClass('slide-number-' + (i+1));
});

Answer 2

看起来应该是：

$(this).addClass('slide-number-' + (i + 1));

Answer 3

这给了你你想要的

$('.slide').each(function(i){
  $(this).addClass('slide-number-' + (i+1));
});

Answer 4

你 + 是在错误的地方......试试这个。它对我有用...

$('.slide').each(function(i){
  $(this).addClass('slide-number'+i);
});

Answer 5

您缺少连接运算符。此外，在 JavaScript 中递增值的约定是双加号。

$('.slide').each(function(i){
  $(this).addClass('slide-number-' + ++i);
});