setIntervalの使い方

window.onload = function() {
	const w = 500;
	const h = 500;
	// Canvas の章で作成した Canvas.js
	const Canvas = new CanvasClass();
	const ctx = Canvas.getContext();
	ctx.fillStyle = 'rgb(191, 255, 191)';
	ctx.fillRect(0, 0, w, h);
	let counter = 1;
	ctx.font = '13px serif'
	// setInterval(function() { 実行したい処理 }, 遅延(ms))
	const id = setInterval(function() {
		ctx.fillStyle = 'rgb(191, 255, 191)';
		ctx.fillRect(0, 0, w, h);
		ctx.fillStyle = 'rgb(0, 0, 0)';
		ctx.fillText(`読み込みが完了してから、${counter}秒経ちました。`, 10, 100);
		counter ++;
	}, 1000);
	document.getElementById('stopButton').addEventListener('click', e => {
		clearInterval(id);
		e.target.innerHTML = 'タイマーを止めました。'
	});
}