js随机颜色效果讲解

26,904次阅读
没有评论

共计 665 个字符,预计需要花费 2 分钟才能阅读完成。

 未标题 -1.png

在前端开发里用的不太多,但是我在一个案例里用到了,自己就根据自己的想法做了一下。

大家都知道,如果在 div+css 里要控制 div 的背景颜色有一个 background-color 这样一个属性;

比如果把背景色设为黑色的,background-color:#000000;// 黑色背景 background-color:#ffffff;// 白色背景。

从上面的两个颜色可以得出一个结论

颜色的值为:#+ 6 位数字 || 6 位字母 || 6 个数字和字母的组和。

这样我们的思路就出来了,哈哈(做东西最主要的是思路。两不是技术 但是也不能说技术不重要)

1. 定义一个数据数组长度为 16 位,里面包括 1 -9 a- f 这些数字字母。

2. 定义一个函数。这个函数,这个函数随机生成 1 -15 随机数字

3。通过循环为生成颜色,

这就是完成的思路。下面上一下代码大家看看哦。

function sj16(){var sjshu=Math.round(Math.random()*10*2);
	do
	{sjshu=Math.round(Math.random()*10*2); 
	}while (sjshu>=15);
	return sjshu;
}

function getColor(){var hex = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'];
	
	var yanse="";
	for(i=0; i

这就是代码,上面有两个函数,和我的思路一样,最后 return 生成随机颜色。

应用案例: 教师招聘网  http://www.jszpw.cc

    正文完
     0
    Yojack
    版权声明:本篇文章由 Yojack 于2024-09-12发表,共计665字。
    转载说明:
    1 本网站名称:优杰开发笔记
    2 本站永久网址:https://yojack.cn
    3 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
    4 本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
    5 本站所有内容均可转载及分享, 但请注明出处
    6 我们始终尊重原创作者的版权,所有文章在发布时,均尽可能注明出处与作者。
    7 站长邮箱:laylwenl@gmail.com
    评论(没有评论)