Javascript 将相同的样式应用于数组中增加 4 的元素组

.list-item {
    &:first-child::before {
      border: 1px solid $green;
    }

    &:nth-child(2)::before {
      border: 1px solid $blue;
    }

    &:nth-child(3)::before {
      border: 1px solid $orange;
    }

    &:nth-child(4)::before {
      border: 1px solid $red;
    }

    &:nth-child(4n+5)::before {
      border: 1px solid $green;
    }

    &:nth-child(4n+6)::before {
      border: 1px solid $blue;
    }

    &:nth-child(4n+7)::before {
      border: 1px solid $orange;
    }

    &:nth-child(4n+8)::before {
      border: 1px solid $red;
    }
}

for (let i = 1; i <= 100; i++) {
  if (i % 4 === 1) {
    console.log(`Should be 1, 5, 9, 13, 17: ${i}`);
  }

  if (i % 4 === 2) {
    console.log(`Should be 2, 6, 10, 14, 18: ${i}`);
  }

  if (i % 4 === 3) {
    console.log(`Should be 3, 7, 11, 15, 19: ${i}`);
  }

  if (i % 4 === 0) {
    console.log(`Should be 4, 8, 12, 16, 20: ${i}`);
  }
}

Javascript相关问答推荐

如何在 cypress 中使用静态嵌套循环

在react JS中映射数组对象的嵌套数据

编辑文本无响应.onClick(扩展脚本)

如何使用JavaScript拆分带空格的单词

如何发送从REST Api收到的PNG数据响应

让chart.js饼图中的一个切片变厚？

当我在Reaction中创建一个输入列表时，我的输入行为异常

一个实体一刀VS每个实体多刀S

如果一个字符串前面有点、空格或无字符串，后面有空格、连字符或无字符串，则匹配正则表达式

传递方法VS泛型对象VS事件特定对象

每次重新呈现时调用useState initialValue函数

警告框不显示包含HTML输入字段的总和

为什么我看到的是回复，而不是我的文档？

AG-GRIDreact 显示布尔值而不是复选框

按特定顺序将4个数组组合在一起，按ID分组

在Java脚本中构建接口的对象

表单数据中未定义的数组键

如何创建一个for循环，用于计算仪器刻度长度并将其放入一个HTML表中？

使用jQuery每隔几秒钟突出显示列表中的不同单词

Reaction：从子组件调用父组件中的函数