JS：随机生成十六进制颜色值

马黑黑

生成随机16进制颜色

马黑黑

生成随机16进制颜色值的方法不止一种，这里介绍相对简洁的做法，其实就一行代码解决问题：

    let c = '#' + Math.random().toString(16).substring(2,8);

上句，变量 c 的值就是一个标准的十六进制颜色，运行效果请参照一楼里的演示。以下是对生成颜色的语句进行分析：

① 十六进制颜色首先需要 # 做前缀，# 是一个字符，所以用小角引号将其包裹起来；

② Math 是 JS 内置对象，头一个字母必须大写。Math.random() 生成一个小于1的浮点数，例如，0.09958032823855723 和 0.9637592126804668 等。Math.random() 可能会得到0，但概率极低；

③ toString() 是 JS 内置方法，将数字转换成字符，该方法加入参数值 16 ，即 toString(16)，表示将步骤 ② Math.random() 生成的浮点数转换为十六进制，得到类似这样的结果，0.f6b8ec7bae6a9；

④ 将步骤 ③ 得到的结果截取6个十六进制数字，就可大功告成。截取方法很多，这里使用 JS 内置的处理字符串的 substring () 方法，该方法需要两个参数，参数一是字节索引，从 0 开始，0 是第一个字节的索引；参数二是截取的结束位置的字节索引，注意，它表示到此处但不包含此处，所以，本例中的第二个参数是8。

【提示】比 substring() 方法更简单的是 substr() 方法，substr(-6) 可以替代本例语句的 substring(2,8) ，它是从步骤 ③ 的结果中从后往前截取6个数字。

马黑黑

醉美水芙蓉 发表于 2023-7-8 09:07
老师今天休息？好早呀！

周末

红影

马黑黑 发表于 2023-7-8 08:20
生成随机16进制颜色值的方法不止一种，这里介绍相对简洁的做法，其实就一行代码解决问题：

    let c =  ...

substr(-6)是从后往前截取6个数字，你的新帖斗转星移就是使用个这个方法

红影

这个真好，点击就能得到颜色，而且上面还有颜色代码。
真是巧了，随手点的几下看到的颜色都是喜欢的

马黑黑

红影 发表于 2023-7-8 09:55
这个真好，点击就能得到颜色，而且上面还有颜色代码。
真是巧了，随手点的几下看到的颜色都是喜欢的{:4_17 ...

颜色是随机的，手气好得到好的颜色

马黑黑

红影 发表于 2023-7-8 09:54
substr(-6)是从后往前截取6个数字，你的新帖斗转星移就是使用个这个方法

以前的16进制随机颜色一直用 substr(-6) 方法

红影

马黑黑 发表于 2023-7-8 09:56
颜色是随机的，手气好得到好的颜色

是啊，所以我是好手气呢

红影

马黑黑 发表于 2023-7-8 09:57
以前的16进制随机颜色一直用 substr(-6) 方法

是的，substring(2,8) 很少见到。两者效果一样吧。

马黑黑

红影 发表于 2023-7-8 11:40
是的，substring(2,8) 很少见到。两者效果一样吧。

一样。substring 是比较正式的，substr 官方建议不要使用，不过程序员们一直都在使用

马黑黑

红影 发表于 2023-7-8 11:39
是啊，所以我是好手气呢

经常洗手，手气就好

南无月

马黑黑 发表于 2023-7-8 08:20
生成随机16进制颜色值的方法不止一种，这里介绍相对简洁的做法，其实就一行代码解决问题：

    let c =  ...

生——转——截。。太神奇了

南无月

思路神奇，代码也神奇，结果更神奇

马黑黑

南无月 发表于 2023-7-8 13:07
思路神奇，代码也神奇，结果更神奇

通水吧的路千万条，哪条好走走哪条

马黑黑

南无月 发表于 2023-7-8 13:06
生——转——截。。太神奇了

JS就是这么了得，关键是你要懂得去分配任务给它

南无月

马黑黑 发表于 2023-7-8 13:10
通水吧的路千万条，哪条好走走哪条

通往高级水吧的只有这么一条

南无月

马黑黑 发表于 2023-7-8 13:10
JS就是这么了得，关键是你要懂得去分配任务给它

现在不敢说懂，可能估计大概自我觉得正在懂的路上。。

红影

马黑黑 发表于 2023-7-8 11:44
一样。substring 是比较正式的，substr 官方建议不要使用，不过程序员们一直都在使用

貌似那个数据很大吧，取前面的比取后面的更节约内存点？

红影

马黑黑 发表于 2023-7-8 11:44
经常洗手，手气就好

我都不敢再点了，前面点出那么多漂亮颜色，我怕再点就没那么好看的了