rgb颜色值

来看看16581375种颜色

是完全用js做的
对js还不是特别的熟悉，好多用法都玩不转，现在先将就一下吧。

我这有些bug，就是必须用鼠标点，而且不管是点击哪一个，颜色值都是按照最新创建元素里的内容去递减的。而且添加在最前面。

慢慢学习吧。

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>标题</title>
		<style>
			body {
				margin: 0px;
				padding: 0px;
			}
			div{
				overflow: hidden;
				float: left;
			}
		</style>
		<script language="JavaScript">
			var id = 2;

			function c() {
				//获取上一个添加的div里的文本内容，最终我想要获取到里面的三个数字
				var te = document.getElementById("" + id - 1 + "").innerText;
				var shuzu1 = te.split(';');//以“;”分隔第一次
				var rshuzu = shuzu1[0].split(':');//以“:”分隔第二次
				var gshuzu = shuzu1[1].split(':');
				var bshuzu = shuzu1[2].split(':');
				var r = rshuzu[1];//最终得到里面的值
				var g = gshuzu[1];//这样的做法缺点就是格式要是规范的，要是里面的符号不一致就不好弄了
				var b = bshuzu[1];
				
				//以下大致思路
				//	r	g	b
				//	255	255	255		开始
				//	255	255	254		
				//	255	255	253		递减
				//	...	...	...
				//	255	255	0		判断 当b<=0时b=255,g-1	
				//	255	254	255		
				//	...	...	...		这样就有255x255x255种不同的结果，也就是16581375种颜色			
				b -= 1;
				if(b <= 0) {
					b = 255;
					g -= 1;
					if(g <= 0) {
						g = 255;
						r -= 1;
						if(r <= 0) {
							//当r<=0的时候,所有结果就都循环完了
							alert("你已阅尽天下颜!");
							//两秒后关闭当前网页
							setTimeout(function(){window.close();},2000);
						}
					}
				}
				var div = document.createElement("div");//创建一个div节点
				//给这个节点添加内容
				div.innerHTML = '<div class="yang" onclick="c()" id="' + id + '" style="background-color: rgba(' + r + ',' + g + ',' + b + ',1)">颜色值r:' + r + ';g:' + g + ';b:' + b + '</div>';
				//把节点添加到body里面最前面的元素的前面
				document.body.insertBefore(div, document.body.firstElementChild);
				id++;
			}
		</script>
	</head>

	<body>
		<div class="yang" onclick="c()" id="1" style="background-color: rgba(255,255,255,1);">
			颜色值r:255;g:255;b:255
		</div>
	</body>

</html>

来看看16581375种颜色

猜你喜欢