通过Button将矩形绘制到画布

<canvas id="myCanvas" width="400" height="200"></canvas>
<button id="drawButton">绘制矩形</button>

var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
var drawButton = document.getElementById("drawButton");

drawButton.addEventListener("click", drawRectangle);

function drawRectangle() {
  context.fillRect(50, 50, 100, 50);
}

#myCanvas {
  background-color: #f0f0f0;
  border: 1px solid #ccc;
}