在JavaScript中获取随机背景颜色

Question

在JavaScript中获取随机背景颜色

16

我是初学者，想在调用特定函数时获得随机背景颜色。

我在网上找到了下面的代码，但我不太明白它是如何工作的。

代码：

function getRandomColor () {
  var hex = Math.floor(Math.random() * 0xFFFFFF);
  return "#" + ("000000" + hex.toString(16)).substr(-6);
}

上面的代码是如何工作的。我理解Math.random()的工作原理，但hex.toString(16)).substr(-6)基本上意味着什么？

能有人给我解释一下上面的代码如何工作吗？

- poorvank

13

你尝试了解代码的工作原理而不是盲目地复制粘贴，我给你点赞！ - Gabe

4个回答

7

hex.toString(16)将hex转换为基数为16的字符串数字表示。然后在字符串开头添加000000，以确保其长度至少为6。最后使用substr(-6)获取结果字符串的最后6个字符。这样可以始终获得#+6个十六进制字符，代表颜色。

- zaquest

这个链接可以帮助更多： http://blog.yoz.sk/2010/06/quick-tip-uint-to-6-digit-rgb-hex/ - choudhury smrutiranjan parida

1

该代码首先选择一个随机数，使用“& 0xFFFFFF”技术确保范围为0到16777215。

一旦我们有了那个随机数，我们使用“.toString（16）”方法将其转换为十六进制，其中16表示我们想要进行十六进制转换。

现在，我们可以认为我们有一个6位十六进制的随机数用于我们的颜色，但要知道“.toString（16）”方法不会为我们做任何填充。

例如，如果随机数是255，即FF的十六进制，则无法使用，因为它不精确地长达6位数字。

一种技术是进行字符串长度检查并添加相应数量的0到'FF'的开头以获得'0000FF'。

在这里，我们看到另一种技术，其中您可以看到添加了固定数量的0到字符串中，然后从末尾截取了固定长度，确保您获得6位数字并正确填充。

我总是使用字符串长度检查或特定的填充函数（我不知道javascript是否有）- 我只回答问题以完全欣赏此问题中显示的技术。

- zaf

-1

/* a complete html page to apply this */
<html>
    <body>

     <button type="button" onclick="setbodybgcolor()">Random Background</button>

         <script>
               function setbodybgcolor(){
                   document.body.style.backgroundColor=getRandomColor ();
               }
               function getRandomColor () {
                       var hex = Math.floor(Math.random() * 0xFFFFFF);
                       return "#" + (hex.toString(16)).substr(-6);
               }
               /* we can do this also
               function setbodybgcolor(){
                     var hex=Math.floor(Math.random()*16777215).toString(16);
                     document.body.style.backgroundColor="#"+hex;
               }*/
         </script>

     </body>
</html>

- Shouvick Paul

如果你想提供一个可行的解决方案，你可以创建一个代码片段并发布。 - Lasithds

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Kiran · Accepted Answer

function getRandomColor () {
  var hex = Math.floor(Math.random() * 0xFFFFFF);
  return "#" + ("000000" + hex.toString(16)).substr(-6);
}

hex.toString(16)将十六进制数转换为在基础 16 中的字符串形式。

语法：

number.toString(radix)

基数：用于表示数字值的进制。必须是介于2和36之间的整数。

2 - The number will show as a binary value
8 - The number will show as an octal value
16 - The number will show as an hexadecimal value

substr(-6)仅取最后6个字符，它会剪掉"000000"，因为它们不是最后6个字符的一部分。