SOURCE

console 命令行工具 X clear

                    
>
console

    let canvas = document.querySelector('#c');
    canvas.width= 500;
    canvas.height = 500;
    draw(canvas)
function draw(canvas){
    let ctx = canvas.getContext('2d');
    let width = canvas.width;
    let height = canvas.height;

    ctx.lineWidth=3
    drawRect({ctx,width,height,count:width/10});
    setInterval(()=>{
        canvas.width = canvas.width;
        ctx.lineWidth=3
        drawRect({ctx,width,height,count:width/10});
    },100)
}


// 绘制随机方框
function drawRect({ctx,width,height,count}){
    for(let i=0;i<count;i++){
        let point = [randomNum(0,width),randomNum(0,height)];
        let size = [randomNum(10,width/4),randomNum(10,width/4)];
        ctx.strokeStyle = new Color().color
        ctx.strokeRect(...point,...size);
    }
}


 //颜色对象
  function Color(){
     this.r = Math.floor(Math.random()*255);
     this.g = Math.floor(Math.random()*255);
     this.b = Math.floor(Math.random()*255);
     this.color = 'rgba('+ this.r +','+ this.g +','+ this.b +',0.8)';
  }

//生成从minNum到maxNum的随机数
function randomNum(minNum, maxNum) {
  switch (arguments.length) {
    case 1:
      return parseInt(Math.random() * minNum + 1, 10);
      break;
    case 2:
      return parseInt(Math.random() * ( maxNum - minNum + 1 ) + minNum, 10);
      //或者 Math.floor(Math.random()*( maxNum - minNum + 1 ) + minNum );
      break;
    default:
      return 0;
      break;
  }
}
<html>
    <body>
	<canvas id="c" ></canvas>
</body>
</html>
#c{
    background: black;
}