console 命令行工具 X clear

console

　var canvas = document.querySelector("#canvas");

let w = 600, h = 600;
let ctx = canvas.getContext("2d");

let zhujsize = 600 / 30;

for (var i = 0; i < 3; i++) {
    name(i, zhujsize);
}


function name(x, y) {
    if (canvas.getContext) {    //  必须判断是否存在该方法，即判断浏览器是否支持canvas
        ctx.beginPath();//开始绘制
        var wei = y / 2;
        ctx.arc(zhujsize * i + wei + 1, zhujsize, wei, 0, 2 * Math.PI);//arc 的意思是“弧”
        ctx.fillStyle = "#ff7676";//设置填充颜色
        ctx.fill();//开始填充
        ctx.strokeStyle = "blue";//将线条颜色设置为蓝色
        ctx.stroke();//stroke() 方法默认颜色是黑色（如果没有上面一行，则会是黑色）
    }
}

<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>贪吃蛇小游戏</title>
</head>

<body>
	<h1>贪吃蛇小游戏</h1>
	<canvas width="600" height="600" id="canvas"></canvas>
</body>