发表于: 2016-12-22 00:52:21
1 1790
一、今天完成的事情:
1.重构了任务1,根据自己的理解写出了选择颜色和选择盒子的方法;
2.继续补充js基础知识;
二、明天要做的事情:
1.利用原生JS重构任务2第一个页面;
三、遇到的问题:
1.一开始我是利用的和选择盒子一样的方法将生成的十六进制颜色存在了数组中,百度了很久数组如何转换成数字,未果。最后。。看到了这个。。原来直接把颜色取成空的字符串,返回的值就储存在字符串中,就成功了。
function randomColor() {
var num =new Array("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f");
var color = ""
for (var i=0;i<6;i++) {
var randam = Math.floor(Math.random()*num.length);
color+=num[randam]
}
return "#"+color;
}
2.一开始我把将盒子加上颜色单独写出来,写成一个函数,结果最后我直接将颜色加在了数组上。。。还是需要用box[i]来具体到没一个盒子再来操作背景颜色。
/*随机抓取box并加上随机颜色*/
var box = document.getElementsByClassName("box");
function chooseBox() {
var newbox = new Array();
for(var i=0;i<3;i++) {
var randam = Math.floor(Math.random()*box.length);
newbox[i]=box[randam];
newbox[i].style.backgroundColor=randomColor();
console.log(randomColor())
}
}
3.颜色加上去之后再点按钮,颜色会疯狂变化,并且复位无效,这个bug还没有解决,我再想想如何解决 - -(加了个if判定,如果有了setinterval效果,就不不再执行,但是尼玛重置之后,开始按钮失效了!!!妈个鸡!)
这几天补了下基础知识,效果已经出来了,有想法也知道该怎么用了,总之多码代码!
老大今天也来成都了,跟我们讲了很多,我的收获也很多,总结成一句话:夯实基础,努力学习!
评论