javascript - 将类添加到每 10 个中的前 5 个元素

Question

<div class="cube"></div>
<div class="cube"></div>
<div class="cube"></div>
<div class="cube"></div>
<div class="cube"></div>
<div class="cube"></div>

从每 10 个中的前 5 个元素中添加类。有很多 Div

Answer 1

我认为这是一种使用 jQuery 的非常好的方法

// Loops through each cube element
$('.cube').each(function(index) {
  // Gets the last integer in the index (ie. 0-9)
  var num = (index + 1) % 10;
  // If 1,2,3,4 or 5
  if (num <= 5 && num > 0)
    // Add the new class
    $(this).addClass('newClass');
});

这是一个完整的例子

$('.cube').each(function(index) {
  var num = (index + 1) % 10;
  if (num <= 5 && num > 0)
    $(this).text('new cube');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="cube">cube</div>
<div class="cube">cube</div>
<div class="cube">cube</div>
<div class="cube">cube</div>
<div class="cube">cube</div>
<div class="cube">cube</div>
<div class="cube">cube</div>
<div class="cube">cube</div>
<div class="cube">cube</div>
<div class="cube">cube</div>