Question

因此，我在HTML中链接了这个非常基本的js脚本，当我尝试运行它时，它没有给出任何错误，但它没有执行应有的功能。这是代码：

var canvas = document.getElementById("canvas"),
  c = canvas.getContext("2d"),
  width = canvas.width = window.innerWidth,
  height = canvas.height = window.innerHeight;
c.fillRect(0, 0, 50, 50);

<!DOCTYPE html>
<html>

<head>
  <script type='module/javascript' src='main.js'></script>
</head>

<body>
  <canvas id='canvas'></canvas>
</body>

</html>

这应该只在左上角画一个正方形，但是它什么也没做。它最初是一个很大的文件，但我只是出于概念证明而将其简化为这个文件。如您所见，该代码段有效，但chrome无效。

Answer 1

您的脚本在画布的声明之前启动。在脚本启动时，您的canvas dom对象未定义。此外，将类型更改为text / javascript。更改为此：

<!DOCTYPE html>
<html>

<head>

</head>

<body>
  <canvas id='canvas'></canvas>
  <script type='text/javascript' src='main.js'></script>
</body>

</html>

Js脚本未运行

1 个答案: