java button随机颜色_Javascript点击按钮随机改变数字与其颜色

先来看看效果图

实例代码

#box {

margin: 100px auto;

width: 200px;

height: 150px;

line-height: 150px;

letter-spacing: 10px;

text-align: center;

font-size: 30px;

font-weight: bolder;

border: 2px solid palegreen;

word-wrap: break-word;

border-radius: 5px;;

position: relative;

}

#btn{

position: absolute;

left:50%;

top:280px;

}

1

2

3

4

//提取标签

var box=document.getElementById("box");

var span=document.getElementsByTagName("span");

var btn=document.getElementById("btn");

var color="";

var str="0123456789abcdef";

btn.οnclick=function(){

for(var i=0;i

for(var j=0;j<6;j++){//随机改变每个数字的颜色

color+=str.substr(parseInt(Math.random()*str.length),1);//取颜色(循环，每次提取一位，进行拼接组成6为颜色的值)

}

span[i].innerHTML=parseInt(Math.random()*10);//生成随机数

span[i].style.color=("#"+color);//随机改变每个span的颜色

color="";

}

}

以上就是这篇文章的全部内容，实现代码很简单，希望对大家能有一定的帮助，如果有问题可以留言交流，小编会尽快给大家回复的。