% 运算符（多个 for 循环）答案

【问题标题】：% Operator (multiple for loops)% 运算符（多个 for 循环）
【发布时间】：2018-01-02 12:32:43
【问题描述】：

我正在寻求使用 % 运算符的帮助，我的目标是根据循环的迭代来更改循环内对象的颜色。

第一个循环设置为红色，第二个循环设置为黄色，第三个循环设置为蓝色，第四个设置为绿色，重复 50 次。

我对此很陌生，所以任何简单的解释都会很有帮助:)

谢谢。

【问题讨论】：

你真的应该发布一些代码，这样我们就可以看到你到目前为止所做的尝试。 SO 不会为您编写代码，也不能回答“只是”问题。编辑：尽管您可能没有时间编辑您的问题，因为这将被否决。
欢迎来到 Stack Overflow！请使用tour 并通读help center，尤其是How do I ask a good question? 做你的研究，search 以获取有关 SO 的相关主题，然后试一试。如果您在进行更多研究和搜索后遇到困难并且无法摆脱困境，请发布您的尝试minimal reproducible example，并具体说明您遇到的问题。人们会很乐意提供帮助。祝你好运！
"第一个循环它会将其设置为红色..." 你是指 loop 还是 iteration？整个事情是一个循环；每次通过它都是一次迭代。
运行for (var i=0; i < 50; i++) console.log(i, i % 4);，你会看到重复的模式。
@AlexK。缺少大括号的符号（-1）！因为我喜欢大括号！

标签： javascript for-loop

【解决方案1】：

这里是简单的sn-p

var colors = ["red", "yellow","blue", "green"];
for(var i=0; i<50; i++){
   var myColorIndex = i % 4;
   var myColor = colors[myCOlorIndex];
   // now do whatever you want with myColor
}

【讨论】：

【解决方案2】：

在第 50 次后使用 setInterval 和 clearInterval。将颜色保存在数组中并获取x%4 元素

var div = document.getElementById('id')
var x = 0;
var interval = setInterval(function () {

   div.style.backgroundColor = ['red','green','blue','yellow'][x%4]

   if (++x === 50) {
       window.clearInterval(interval);
   }
}, 1000);

#id{
  width:200px,
  height:300px
  }

&lt;div id = "id"&gt;&lt;/div&gt;

【讨论】：