JS - 使用变量设置Div背景颜色

时间:2012-06-16 22:23:13

标签: javascript html colors

基本上,我的一个伙伴正在练习JS,他对测试基本网站有了一个想法。所以我说我们将有竞争来完成它。我们此时都遇到了错误。我们在JS中创建了一种颜色。但是当我们需要输出时它不起作用。我有这个。

document.getElementById("outputColor").style.backgroundColor=currentColor;

通过此

制作当前颜色
part1 = Math.floor(Math.random() * (255 - 0 + 1)) + 0;
part2 = Math.floor(Math.random() * (255 - 0 + 1)) + 0;
part3 = Math.floor(Math.random() * (255 - 0 + 1)) + 0;
currentColor = "\"rgb (" + part1 + ", " + part2 + ", " + part3 + ")\"";

将当前颜色放在“”中意味着它期望currentColor的值。不是实际的变量值。

希望这是有道理的。这是可能的,还是我们在错误的树上吠叫?

由于

编辑: 它确实有一个与之相关的CSS风格

#outputColor
{
    height: 100px;
    width: 100px;
    background-color: rgb(0,0,0);
}

编辑:已解决,解决方案

currentColor = "rgb(" + part1 + ", " + part2 + ", " + part3 + ")";

谢谢大家!

3 个答案:

答案 0 :(得分:3)

有太多双引号,请使用:

currentColor = "rgb(" + part1 + ", " + part2 + ", " + part3 + ")";

答案 1 :(得分:1)

currentColor = "rgba(" + part1 + ", " + part2 + ", " + part3 + ",0)";

答案 2 :(得分:1)

currentColor = "rgb(" + part1 + ", " + part2 + ", " + part3 + ")"; // RGB

或使用十六进制格式

currentColorHex="#"+(part1).toString(16)+(part2).toString(16)+(part3).toString(16);

DEMO.