通过html5画布绘制一个矩形

draw a rectangle via a html5 canvas?

本文关键字:一个 绘制 html5 布绘制 通过      更新时间:2023-09-26

我是一个初学者,我一直在HTML 5中在画布上画一个矩形;HTML代码:

<script src="new 3y.js"></script>
<title>test</title>
</head>
<body>
<section id="main">
    <canvas id="canvas" width="600" height="400">
      test
    </canvas>
</section>
</body

my js code:

function doFirst() {
var x = document.getElementbyId('canvas');
canvas = x.getContext("2d");
canvas.strokeRect(10,10,100,200);
}
window.addEventListener("load" , doFirst ,false);

问题是您使用的是document.getElementbyId,但b必须是大写的。

修复,你的代码工作正常:

function doFirst() {
  var x = document.getElementById('canvas');
  canvas = x.getContext("2d");
  canvas.strokeRect(10,10,100,200);
}
window.addEventListener("load" , doFirst ,false);
<body>
<section id="main">
    <canvas id="canvas" width="600" height="400">
      test
    </canvas>
</section>
</body>