document.getElementById(“content”).style.height=document.documentElement.clientHeight+”px”;
document.getElementById(“rec_place”).style.height=document.documentElement.clientHeight-85+”px”;varmakeRec=document.getElementById(“makeRec”);varclearRec=document.getElementById(“clearRec”);varrec_num=document.getElementById(“rec_num”);varrec_place=document.getElementById(“rec_place”);vararr= newArray();//点击生成按钮
makeRec.οnclick=function(){varnum=rec_num.value;if(parseInt(num)!=num){
alert(“请输入整数!”)
}else if(parseInt(num)<=0){
alert(“请输入大于0的整数!”)
}else{for(vari=0;i
rec.createRec();
arr.push(rec);
}
}
}//点击清除画布
clearRec.οnclick=function(){varnum=rec_place.getElementsByTagName(“div”).length;for(vari=0;i
arr[0].ruinRec();
arr.shift();
}
}
}//var colors = [“red”,”blue”,”green”,”yellow”,”black”];
functionRectangle(index,rec_place){this.index=index;this.rec_height=Math.floor(Math.random()*101+100);this.rec_width=Math.floor(Math.random()*101+100);//this.rec_color = colors[Math.floor(Math.random()*5)];
this.rec_color= “rgb(“+Math.floor(Math.random()*256)+”,”+Math.floor(Math.random()*256)+”,”+Math.floor(Math.random()*256)+”)”;this.rec_left=Math.floor(Math.random()*(rec_place.offsetWidth-this.rec_width-1)+2);this.rec_top=Math.floor(Math.random()*(rec_place.offsetHeight-this.rec_height)+87);this.myRec= null;//方法一,构造函数
//this.createRec =function(){
//this.myRec = document.createElement(“div”);
//this.myRec.className = “mydiv”;
//this.myRec.innerHTML = “我是矩形”+(this.index+1);
//this.myRec.style.height = this.rec_height+”px”;
//this.myRec.style.width = this.rec_width+”px”;
//this.myRec.style.border = “3px solid “+this.rec_color;
//this.myRec.style.left = this.rec_left+”px”;
//this.myRec.style.top =this.rec_top+”px”;
//rec_place.appendChild(this.myRec);
//}
//this.ruinRec = function(){
//rec_place.removeChild(this.myRec);
//}
}//原型+构造函数:让函数共用
Rectangle.prototype={
createRec:function(){this.myRec=document.createElement(“div”);this.myRec.className= “mydiv”;this.myRec.innerHTML= “我是矩形”+(this.index+1);this.myRec.style.height= this.rec_height+”px”;this.myRec.style.width= this.rec_width+”px”;this.myRec.style.border= “3px solid”+this.rec_color;this.myRec.style.left= this.rec_left+”px”;this.myRec.style.top=this.rec_top+”px”;
rec_place.appendChild(this.myRec);
},
ruinRec:function(){
rec_place.removeChild(this.myRec);
}
}