通过javaScript向div添加背景色

尝试使用for循环向div添加不同的背景色。 我将所有颜色存储在20个变量中，我希望20个div中的每一个都有自己的颜色。我试着把它设置成这样的“背景色”：（bar+I），但这样就行了。 如果我只传递一个变量，比如bar1，它就会工作。我做错了什么？非常感谢您的帮助

var bar1 = "#afb626";
var bar2 = "#5b590a";
var bar3 = "#b44708";
var bar4 = "#950000";
var bar5 = "#eb9f9f";
var bar6 = "#246d13";
var bar7 = "#afb626";
var bar8 = "#a60046";
var bar9 = "#733702";
var bar10 = "#d1570d";
var bar11 = "#afb626";
var bar12 = "#5b590a";
var bar13 = "#b44708";
var bar14 = "#950000";
var bar15 = "#eb9f9f";
var bar16 = "#246d13";
var bar17 = "#afb626";
var bar18 = "#a60046";
var bar19 = "#733702";
var bar20 = "#afb626";


for (var i = 0; i < 20; i++) {
    $('<div/>', { id: 'foo'+i,}).appendTo('body');
      $("#foo"+i).css({"background-color":(bar+i),"height": "100%", "width": screenWidth, "float": "right"});
}

var bar1=“#afb626”；
var bar2=“#5b590a”；
var bar3=“#b44708”；
var bar4=“#950000”；
var bar5=“#eb9f9f”；
var bar6=“#246d13”；
var bar7=“#afb626”；
var bar8=“#a60046”；
var bar9=“#733702”；
var bar10=“#d1570d”；
var bar11=“#afb626”；
var bar12=“#5b590a”；
var bar13=“#b44708”；
var bar14=“#950000”；
var bar15=“#eb9f9f”；
var bar16=“#246d13”；
var bar17=“#afb626”；
var bar18=“#a60046”；
var bar19=“#733702”；
var bar20=“#afb626”；
对于（变量i=0；i<20；i++）{
$（''，{id:'foo'+i，}）.appendTo（'body'）；
$（“#foo”+i）.css（{“背景色”：（条形+i），“高度”：“100%”，“宽度”：屏幕宽度，“浮动”：“右”}）；
}

应该是

(window["bar"+i])

应该是

(window["bar"+i])

改用数组：

var bars = ["#afb626", "#5b590a", ...];

for (var i = 0, z = bars.length; i < z; i++) {
    $('<div/>', {
        id: 'foo' + i
    }).css({
         backgroundColor: bars[i],
         height: "100%",
         width: screenWidth,
         float: "right"
    }).appendTo('body');
}

var条=[“#afb626”、“#5b590a”、…]；
对于（变量i=0，z=bar.length；i

改用数组：

var bars = ["#afb626", "#5b590a", ...];

for (var i = 0, z = bars.length; i < z; i++) {
    $('<div/>', {
        id: 'foo' + i
    }).css({
         backgroundColor: bars[i],
         height: "100%",
         width: screenWidth,
         float: "right"
    }).appendTo('body');
}

var条=[“#afb626”、“#5b590a”、…]；
对于（变量i=0，z=bar.length；i

您的代码中存在一些问题。我给你举了个简单的例子

var bar=[“afb626”、“5b590a”、“b44708”、“950000”、“eb9f9f”、“246d13”，
“afb626”、“a60046”、“733702”、“d1570d”、“afb626”、“5b590a”，
“b44708”、“950000”、“eb9f9f”、“246d13”、“afb626”、“a60046”，
“#733702”、“#afb626”]；
对于（变量i=0；i

问题

您应该为项目使用数组。使负载更有意义

for（变量i=0；i<20；i++）{
$（“”，{id:'foo'+i，/*<这里不应该有逗号*/}）；
$（“#foo”+i）.css（{“背景色”：（条形+i），“高度”：“100%”，“宽度”：屏幕宽度，“浮动”：“右”}）；
}
//屏幕宽度是多少？
//您不应该创建您的元素-将其附加到主体，然后重新选择它？？

您的代码中存在一些问题。我给你举了个简单的例子

var bar=[“afb626”、“5b590a”、“b44708”、“950000”、“eb9f9f”、“246d13”，
“afb626”、“a60046”、“733702”、“d1570d”、“afb626”、“5b590a”，
“b44708”、“950000”、“eb9f9f”、“246d13”、“afb626”、“a60046”，
“#733702”、“#afb626”]；
对于（变量i=0；i

问题

您应该为项目使用数组。使负载更有意义

for（变量i=0；i<20；i++）{
$（“”，{id:'foo'+i，/*<这里不应该有逗号*/}）；
$（“#foo”+i）.css（{“背景色”：（条形+i），“高度”：“100%”，“宽度”：屏幕宽度，“浮动”：“右”}）；
}
//屏幕宽度是多少？
//您不应该创建您的元素-将其附加到主体，然后重新选择它？？

您应该真正使用数组。是的，您可能是对的，但不确定是否使用数组。您应该真正使用数组。是的，您可能是对的，但不确定是否使用数组。抱歉，我没有添加所有代码。screenWidth是一个用来决定div宽度的变量。对不起，我没有添加所有代码。screenWidth是一个我用来决定div宽度的变量。只是为了让你知道对象中最后一项后面的逗号会在IEU中打断，但这在2秒才能防止这种情况发生，那么就去做。只是想让你知道，对象中最后一项后面的逗号会打断你所说的IE8，但这是在2秒钟才能防止这种情况发生，那么就这样做。

for (var i = 0; i < 20; i++) {
    $('<div/>', { id: 'foo'+i, /* < you shouldn't have a comma here */ }).appendTo('body');
      $("#foo"+i).css({"background-color":(bar+i),"height": "100%", "width": screenWidth, "float": "right"});
}

// What is screenWidth?
// You shouldn't create your element - append it to body then reselect it??