迭代通过在JavaScript
问题描述:
我想在CSS中使用的所有颜色列表的颜色,但他们似乎被储存在一个基地16格式。我觉得这样的事情可能会奏效,但它不会做我想做的,迭代通过在JavaScript
for(x; x< 100; x++)
{
color = x.toString(16);
}
答
在CSS 3使用的颜色包括每个红色,绿色,蓝色和Alpha通道的,我相信的8位是8位(但被定义为十进制数,所以很难说)。可以将这些颜色表示为rgba或hsla。使用十六进制,您只能表示100%不透明的颜色。通过一种颜色的八位迭代是很容易的:
for (var i=0; i<256; i++) {
var redChan = i;
}
要遍历所有的颜色可能是通过嵌套这个循环四个层次深,但是,让你想在迭代什么方向的一些假设它。也将是一个相当长的行动。在CSS
// This is not intended to be the best solution, just to demonstrate the basic algorithm.
for (var r=0; r<256; r++) {
for (var g=0; g<256; g++) {
for (var b=0; b<256; b++) {
// Assume we have 8 bits of alpha to use.
for (var a=0; a<256; a++) {
console.log('rgba(' + [r,g,b,a/255].join(',') + ')');
}
}
}
}
答
颜色通常可以通过红,绿和蓝的值(如0〜255之间的整数),并且有时为透明度的α值进行说明。
如果您对alpha值不感兴趣,可以用十六进制格式在CSS中编写#RRGGBB格式的颜色。
如果我们忘记了我们使用分组为红,绿,蓝,可以看出,我们正在写000000
(0
)和FFFFFF
(16777215
)之间的数字。因此,您可以将每个RGB颜色描述为此范围内的整数。
var i = 0, colour;
for (; i < 16777216; ++i) { // this is a BIG loop, will freeze/crash a browser!
colour = '#' + ('00000' + i.toString(16)).slice(-6); // pad to 6 digits
// #000000
// #000001
// ... #000100 ...
// #FFFFFE
// #FFFFFF
}
上面的代码遍历所有16777216
颜色,所以我建议尽量不要运行这样一个循环,但你可以看到它是如何变成一个独特的十六进制颜色范围内的整数。
答
在JavaScript中,你可以使用“0X”一个号码之前,使其十六进制和“0”,使之八。使用这种方法,这应该是最好的代码。 这可能会导致浏览器崩溃,因为在所有CSS中都有16,581,375种不同的可能的十六进制颜色。这比有兆字节(大约100万)的字节数多,或者需要多少年才能破解17-小写字母的密码。
var colors = new Array();
for(col=0x0;col<=0xFFFFFF;col++) {
colors.push("#" + col);
}
你是什么意思,所有在CSS中使用的颜色?你为什么期望代码能够做你想做的事?如何描述你想要的内容,并展示你迄今为止尝试实现的目标。 – 2013-05-12 01:23:26
实际上想要使用滑块小部件。滑块的每个增量都会将div更改为新颜色。 – 2013-05-12 01:27:29