JS如何输出随机背景颜色

最新推荐文章于 2025-07-03 19:33:04 发布

原创

最新推荐文章于 2025-07-03 19:33:04 发布 · 2.1k 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#JAVASCRIPT

JS如何输出随即背景颜色

**原理：**通过random（）方法生成的随机数乘以255并取整，循环三次获得rgb（）三个值，然后进行封装，使其按照指定格式输出。
十六进制方法需调用 toString（16）方法，颜色属性值转换为十六进制，然后封装输出。

PS:将以下代码直接粘贴，即可运行。

<head>
	<meta charset="utf-8">
	<title>随机修改背景颜色</title>
</head>

<script type="text/javascript">
	window.onload=function(){
		var oDiv=document.getElementById('div');
		var oBtn=document.getElementById('btn');
		var oBtn2=document.getElementById('btn2');
		var timer;
		// rgb方法
		function changeColor(){
			var r=Math.round(255*Math.random()) ;
			var g=Math.round(255*Math.random());
			var b=Math.round(255*Math.random());
			var rgb="rgb("+r+","+g+","+b+")";
			return rgb;
		}
		// 十六进制方法
		function change16Color(){
			var r=Math.round(255*Math.random()).toString(16) ;
			var g=Math.round(255*Math.random()).toString(16);
			var b=Math.round(255*Math.random()).toString(16);
			var rgb2="#"+r+g+b;
			r