我的代码无效：有人可以帮我吗？

问题描述

我想做一个画布和一行，但是JavaScript控制台说：“ null不是对象（评估'c.getContext'）”。

// HTML code:

<!DOCTYPE html>
<html>
<head>
<script src="provaCanvas.js" type="text/javascript"></script>
</head>
<body>
<canvas id="canvas-id" width="200" height="100"
style="border: solid 1px  black;"></canvas>
</body>
</html>


// JavaScript code:

var c = document.getElementById("canvas-id");
var ctx = c.getContext('2d')
ctx.moveto(0,0);
ctx.lineto(200,100);
ctx.stroke();

解决方法

尝试将脚本标签移动到画布标签下方的某个位置。

为什么有效：
我猜您提供的Javascript代码就是<script src="provaCanvas.js" type="text/javascript"></script>正在调用的代码。问题是您的脚本在画布元素加载之前正在寻找该画布元素。

html javascript