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

4

基本上,我的一个朋友正在练习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个回答

4

双引号太多,请使用此符号:

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

1
谢谢!基本正确,只是在 RGB 后面有一个多余的空格。正确答案是:currentColor = "rgb(" + part1 + ", " + part2 + ", " + part3 + ")";。谢谢 :) - Kyle93

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

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

或使用十六进制格式

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

演示。


谢谢你的回答,然而Dr.Molle比你更快地回答了我的问题。我已经从他那里得到了答案。你说得没错,感谢你的回复。+1 - Kyle93

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接