Javascript 使用圆中的数组更改项目的背景色

我有一个特别的挑战，并且正在杀死我，因为我不知道如何去做我想做的事情

我有5个项目：4个div，宽度和高度为50px，机身

我想创建一个函数来设置这些项目的背景色，例如：

var colors = ['red', 'blue', 'green', 'black', 'pink'];

div1 = red
div2 = blue
div3 = green
div4 = black
body = pink

如果浏览器重新加载，它们会发生更改：

div1 = pink
div2 = red
div3 = blue
div4 = green
body = black

如果浏览器发生了同样的变化

有没有jquery插件可以做到这一点？我不知道从哪里开始。。我已经在函数中创建了包含项的数组：

<script type="text/javascript">
function shuffle(array) {
  var currentIndex = array.length, temporaryValue, randomIndex ;

  // While there remain elements to shuffle...
  while (0 !== currentIndex) {

    // Pick a remaining element...
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex -= 1;

    // And swap it with the current element.
    temporaryValue = array[currentIndex];
    array[currentIndex] = array[randomIndex];
    array[randomIndex] = temporaryValue;
  }

  return array;
}
</script>

HTML:

---

我认为您的主要问题是确定使用了什么浏览器，因此您可以阅读以下内容：

---

然后，您可以开始根据浏览器的不同编写代码来更改颜色。我希望这就是答案。

我认为您的主要问题在于它决定了使用的浏览器，因此您可以阅读以下内容：

---

然后，您可以开始根据浏览器的不同编写代码来更改颜色。我希望这就是答案。

如果您希望在每次加载页面时更改值，则需要使用或cookies。下面是一个使用

localStorage

的示例：

var colors = ['red', 'blue', 'green', 'black', 'pink'];

if(localStorage.count)
{
    localStorage.count = (localStorage.count + 1) % colors.length;
}
else
{
    localStorage.count = 0;
}

for(var i = 0; i < colors.length; i++)
{
    var color = colors[(localStorage.count + i) % colors.length];
    //Set the i'th element's back-color to color
}

var colors=[‘红色’、‘蓝色’、‘绿色’、‘黑色’、‘粉色’]；
if（localStorage.count）
{
localStorage.count=（localStorage.count+1）%colors.length；
}
其他的
{
localStorage.count=0；
}
对于（变量i=0；i

---

显示模方法工作原理示例的小提琴

如果希望在每次加载页面时更改值，则需要使用或cookie。下面是一个使用

localStorage

的示例：

var colors = ['red', 'blue', 'green', 'black', 'pink'];

if(localStorage.count)
{
    localStorage.count = (localStorage.count + 1) % colors.length;
}
else
{
    localStorage.count = 0;
}

for(var i = 0; i < colors.length; i++)
{
    var color = colors[(localStorage.count + i) % colors.length];
    //Set the i'th element's back-color to color
}

var colors=[‘红色’、‘蓝色’、‘绿色’、‘黑色’、‘粉色’]；
if（localStorage.count）
{
localStorage.count=（localStorage.count+1）%colors.length；
}
其他的
{
localStorage.count=0；
}
对于（变量i=0；i

---

显示模方法工作原理示例的小提琴

您可以使用此函数随机洗牌数组：

<script type="text/javascript">
function shuffle(array) {
  var currentIndex = array.length, temporaryValue, randomIndex ;

  // While there remain elements to shuffle...
  while (0 !== currentIndex) {

    // Pick a remaining element...
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex -= 1;

    // And swap it with the current element.
    temporaryValue = array[currentIndex];
    array[currentIndex] = array[randomIndex];
    array[randomIndex] = temporaryValue;
  }

  return array;
}
</script>

函数洗牌（数组）{
var currentIndex=array.length，temporaryValue，randomIndex；
//虽然还有一些元素需要洗牌。。。
而（0！==currentIndex）{
//选择剩余的元素。。。
randomIndex=Math.floor（Math.random（）*currentIndex）；
currentIndex-=1；
//并将其与当前元素交换。
临时值=数组[currentIndex]；
数组[currentIndex]=数组[randomIndex]；
数组[randomIndex]=临时值；
}
返回数组；
}

这就是如何应用它：

<script type="text/javascript">
var colors = ['red', 'blue', 'green', 'black', 'pink'];
shuffle(colors);
// and your code to assign colors to divs and body
</script>

var colors=[“红色”、“蓝色”、“绿色”、“黑色”、“粉色”]；
洗牌（颜色）；
//以及为div和body指定颜色的代码

您可以使用此函数随机洗牌数组：

<script type="text/javascript">
function shuffle(array) {
  var currentIndex = array.length, temporaryValue, randomIndex ;

  // While there remain elements to shuffle...
  while (0 !== currentIndex) {

    // Pick a remaining element...
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex -= 1;

    // And swap it with the current element.
    temporaryValue = array[currentIndex];
    array[currentIndex] = array[randomIndex];
    array[randomIndex] = temporaryValue;
  }

  return array;
}
</script>

函数洗牌（数组）{
var currentIndex=array.length，temporaryValue，randomIndex；
//虽然还有一些元素需要洗牌。。。
而（0！==currentIndex）{
//选择剩余的元素。。。
randomIndex=Math.floor（Math.random（）*currentIndex）；
currentIndex-=1；
//并将其与当前元素交换。
临时值=数组[currentIndex]；
数组[currentIndex]=数组[randomIndex]；
数组[randomIndex]=临时值；
}
返回数组；
}

这就是如何应用它：

<script type="text/javascript">
var colors = ['red', 'blue', 'green', 'black', 'pink'];
shuffle(colors);
// and your code to assign colors to divs and body
</script>

var colors=[“红色”、“蓝色”、“绿色”、“黑色”、“粉色”]；
洗牌（颜色）；
//以及为div和body指定颜色的代码

这应该是一项非常简单的任务

var colors=[‘红色’、‘蓝色’、‘绿色’、‘黑色’、‘粉色’]；
var计数=0；
函数colorMe（）{
$（“body”）.find（“div”）.each（function（）{
var指数=$（“主体”）.find（“div”）.index（本）；
变量i=（索引+计数）%colors.length；
$（this.css（“背景色”，colors[i]）；
});
计数++；
}
$（窗口）。调整大小（颜色）；
$（文档）.ready（colorMe）

第一
第二
第三
第四，这应该是一项非常简单的任务


var colors=[‘红色’、‘蓝色’、‘绿色’、‘黑色’、‘粉色’]；
var计数=0；
函数colorMe（）{
$（“body”）.find（“div”）.each（function（）{
var指数=$（“主体”）.find（“div”）.index（本）；
变量i=（索引+计数）%colors.length；
$（this.css（“背景色”，colors[i]）；
});
计数++；
}
$（窗口）。调整大小（颜色）；
$（文档）.ready（colorMe）

第一
第二
第三
第四
如果浏览器发生更改，您的意思是什么？你是说如果从Chrome到Firefox，你想要不同的颜色？你说的“浏览器改变”是什么意思？你也要看看。每次更改时，将计数乘以数组长度的一个模，然后使用该值循环通过arrayI guess OP means->页面刷新/重新加载后颜色的更改？如果要在重新加载后更改内容，需要将数组中的旧位置保存在cookie或localStorage中。是。。抱歉，伙计们，如果浏览器刷新/重新加载。。谢谢@nevermind如果浏览器发生变化，你的意思是什么？你是说如果从Chrome到Firefox，你想要不同的颜色？你说的“浏览器改变”是什么意思？你也要看看。每次更改时，将计数乘以数组长度的一个模，然后使用该值循环通过arrayI guess OP means->页面刷新/重新加载后颜色的更改？如果要在重新加载后更改内容，需要将数组中的旧位置保存在cookie或localStorage中。是。。抱歉，伙计们，如果浏览器刷新/重新加载。。谢谢@nevermindIt handles也可以通过颜色变化调整大小-请参阅完整页面它还可以通过颜色变化调整大小-请参阅完整页面