发表于: 2017-03-26 22:51:41

1 622


今天完成的事情:完成了任务1
明天计划的事情:看高程,做任务2
遇到的问题:一开始完成的时候颜色会越闪越快,问了师兄,设置计时器的时候,在设置了计时器的函数里面第一条,设置一个清楚定时器,逻辑是每执行一次计时器就会清楚一次计时器,这样闪的时候就正常了。

function startChange(){
clearInterval(timer);
   for(var i=0;i<box.length;i++){
box[i].style.backgroundColor="#fff";
   }
ran();
   for(var n=0;n<3;n++){
box[num[n]].style.backgroundColor=color[n];
   }
timer=setInterval(startChange,800);
}

代码是这样的,但是把计时器代码放在清楚计时器代码下面也可以实现,一开始想不通,计时器是每隔一段时间执行一次函数,如果放在清楚计时器下面,那他到执行计时器的时候又重新开始这个函数,后面的代码就没有用了。但是效果不是这样。师兄说是计时器这条代码放在哪里无所谓,计时器不会影响别的代码,它只是一到这个时间就会执行,如果时间还没到的话就会跳过计时器,计时器相当于是一个插队执行的代码,到了时间就插进来执行一下。

随机数不重复的问题,今天才知道,设置了if条件是三个数字不重复的话,可以直接在IF语句里写函数名,就可以重新开始这个函数。一直以为要用return,但是不知道怎么用,问了师兄才知道还可以这样用。

for(var i=0;i<3;i++){
num[i]=Math.floor(Math.random()*9);
}
if(num[0]==num[1]||num[1]==num[2]||num[0]==num[2]){
ran();
}

随机颜色的代码不会写..在百度上看到的用RGB,然后R,G,B等于一个0~255的随机数来实现

             var r=Math.floor(Math.random()*256);
             var g=Math.floor(Math.random()*256);
             var b=Math.floor(Math.random()*256);
             return "rgb("+r+','+g+','+b+")";

这个挺好理解的,但是我没有用这个,在另一个网站上看到的代码..看不懂,所以直接复制了

for(var j=0;j<3;j++){
color[j]='#'+('00000'+(Math.random()*0x1000000<<0).toString(16)).slice(-6);
}

这样可以实现出三个16进制的随机数,但是那上面写<<0可以实现去整不知道为什么..前面的5个0和后面的slice也不知道是为什么..toString(16)是实现把数转化成16进制的数

收获:几个逻辑操作符||或者,&&并且,更熟悉了,还有清楚定时器,师兄说在每个函数开始的时候放一个清楚定时器是一个好习惯,还有JS的代码是一条一条这样下来执行的,除了个别的代码除外,就像计时器,还有可以在一个函数里去引用别的函数,像这次ran()函数我就是用来实现随机数和随机颜色,然后在要用来执行的函数里调用他。设置终止函数的时候,先清楚定时器,然后把所有的DIV的颜色设置成初始值,这样就可以让颜色重置了,如果想实现暂停的话就只用设置清楚定时器就行了。


我为了看出有没有重复的数字所以用的白色背景。


返回列表 返回列表
评论

    分享到