在javascript中迭代颜色

Question

我想列出css中使用的所有颜色，但它们似乎以16格式存储。 我认为这样的事情可能有用，但它没有做我想要的，

for(x; x< 100; x++)
{
   color = x.toString(16);
}

Answer 1

CSS 3中使用的颜色包括红色，绿色，蓝色和alpha通道各8位，我相信它是8位（但定义为十进制数，所以很难说）。 可以将这些颜色表示为rgba或hsla 。 使用十六进制，您只能表示100％不透明的颜色。 通过八位一种颜色迭代很容易：

for (var i=0; i<256; i++) {
    var redChan = i;
}

迭代所有颜色可能是通过将这个循环嵌套四层深，但这会对你想要迭代的方向做出一些假设。它也将是一个非常长的操作。

// 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(',') + ')');
            }
        }
    }
}

Answer 2

在JavaScript中，您可以在数字前使用“0x”使其成为十六进制，使用“0”使其成为八进制。 使用此方法，这应该是最好的代码。 这可能会使您的Web浏览器崩溃，因为所有CSS中都有16,581,375种不同的十六进制颜色。 这比一兆字节（大约100万）中的字节数多，或者需要多少年才能破解17个小写的字母密码。

var colors = new Array();
for(col=0x0;col<=0xFFFFFF;col++) {
  colors.push("#" + col);
}

Answer 3

CSS中的颜色通常用红色，绿色和蓝色值（0到255之间的整数）来描述，有时候是透明度的alpha值。

如果您对alpha值不感兴趣，可以使用#RRGGBB十六进制格式在CSS中编写颜色。

如果我们忘记了我们使用红色，绿色和蓝色的分组，可以看出我们在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种颜色，所以我建议不要运行这样的循环，但你可以看到它如何将范围内的整数更改为唯一的十六进制颜色。