如何在javascript中获取每个有效的十六进制代码

Posted 2023-03-06

【中文标题】如何在javascript中获取每个有效的十六进制代码

【英文标题】：How to get every valid hex code in javascript

【发布时间】：2016-07-15 05:06:56

【问题描述】：

这是我两天前开始工作的一件小事，我以为这会是一个快速的小脑部问题，然后我又要回去吃午饭了。但是我在挣扎。我想获取所有有效的十六进制颜色代码的数组。最好不要让浏览器崩溃。

这是我目前想出的。

app.directive 'randomColor', () ->
  link: (scope) ->
    scope.colors = new Array
    col = 0x0
    while col <= 0xFFF
      if (col > 0x111 && col < 0xFFF)
        scope.colors.push '#' + col
      col++
    autocolor = (hexcode) ->
      colorChange = () ->
        $("#colorvomit").append("<span style='padding: 1px 10px 1px 10px;background-color: " +hexcode+";border: 1px solid black;'></span>")
      setTimeout(colorChange, 5000)
    _.each(scope.colors, autocolor)

请记住我正在使用 coffescript 和 angular js。使用下划线库，所以我可以使用 _.each。

所以我得到了这个结果

您可以看到底部有很多白色方块，并且它会一直持续很长时间，因为它返回了无效的十六进制代码，例如 #1223（4 位数字）。

所以这是我的问题，获取所有有效的十六进制颜色代码的最佳方法是什么让我说 6 long 我有 3 long (FFF) 因为它会崩溃，否则会崩溃而不会得到无效代码。感谢您的所有帮助，我认为这将是一个有趣的问题。

我已经完成了我的研究，但找不到类似的东西。因为我们希望它们都按顺序排列，就像 111 112 113 等...

【参考方案1】：

我没有使用嵌套循环，而是将十进制从/转换为十六进制。没有更好，只是不同。 Fiddle 下面，显示操作。

*编辑：修改此代码以运行所有 1600 万种颜色。小提琴仍然使用每种颜色 8 位（#000; 简短表示法），因此它不会永远运行

var $cv= $("#colorvomit");
for(var col=parseInt("000000", 16); col<=parseInt("ffffff", 16); col++) 
    var hex = col.toString(16);
  hex = '0'.repeat(6-hex.length) + hex;
    $cv.append('<span style="background-color:#'+hex+';"> &nbsp; </span>');

https://jsfiddle.net/4tm54u62/1/

【讨论】：

这太酷了，我想要实现的是有一种方法可以使用 6 十六进制代码。

啊，我搞定了，对不起，我不得不在另一个家伙第一个而且也是正确的之前给他答案。但是你的解决方案更多的是我想扔掉的显示器我​​想再次感谢你它真的很有帮助。

没问题，完全明白。此外，修改了我的答案以显示如何修改完整的每色 16 位结果，并包括完整的 0x000 到 0xfff 范围。 Fiddle 仍然显示 8 位...在 16 位中花费的时间太长。

【参考方案2】：

请记住，256*256*256 = 16777216 所以执行需要一些时间。

var result = '';
for(var i=0;i<256;i++)
    for(var j=0;j<256;j++)
        for(var k=0;k<256;k++)
           r = i.toString(16);
           g = j.toString(16);
           b = k.toString(16);
             if(r.length!=1||g.length!=1||b.length!=1)
        if(r.length==1)r='0'+r;
        if(g.length==1)g='0'+g;
        if(b.length==1)b='0'+b;
        //will use 3 length color unless one of r,g or b is to digit then 6 length will be used.
            result += r + g + b + '<br/>';
        

document.write(result);

如果你想要它在数组中，那么：

var result = [];
for(var i=0;i<256;i+=16)
    for(var j=0;j<256;j+=16)
        for(var k=0;k<256;k+=16)
           r = i.toString(16);
           g = j.toString(16);
           b = k.toString(16);
            if(r.length!=1||g.length!=1||b.length!=1)
            if(r.length==1)r='0'+r;
            if(g.length==1)g='0'+g;
            if(b.length==1)b='0'+b;
             //will use 3 length color unless one of r,g or b is to digit then 6 length will be used.
            result.push(r + g + b);
        

见DEMO

这是一个图形DEMO，由于我们无法显示数百万种颜色，因此颜色数量减少了。

【讨论】：

这不是作弊，因为我们想要十六进制代码数组。不要使用 RGB 代码。另外我可能在这里错了，但该代码可能不会错过一些颜色。

这个代码生成十六进制代码。我只是使用了 r、g 和 b 变量来使代码有意义

@Morphasis，当我更正我的代码时，我错误地删除了一些代码。我刚刚更正了。

您好，我只是要启动它并对其进行测试，看到它看起来不错会很有趣，让我们看看它是否可以运行:)

我已经创建了一个演示：(jsfiddle.net/g75s9exc/1/)[https://jsfiddle.net/g75s9exc/1/]