括号没有加载我的画布答案

【问题标题】：Brackets doesn't load my canvas括号没有加载我的画布
【发布时间】：2018-10-01 22:52:27
【问题描述】：

当我将我的 JavaScript 文件引用到我的 index.html 文件（同一文件夹中的两个单独文件），并在浏览器中加载 html 文件时，我在 javascript 文件中制作的绘图不会显示在画布中.

这是HTML 代码：

<!DOCTYPE html>
<html>
   <head>
      <title>snake</title>
      <script language="javascript" type="text/javascript" src="snake.js"></script>
   </head>
   <body>
      <canvas id="dots" height="500" width="500"></canvas>
   </body>
</html>

这里是 JavaScript：

function snake() {
    var canvas = document.getElementById("dots");
    var snakehead = canvas.getContext('2d');
    snakehead.beginPath();
    snakehead.arc(100, 75, 50, 0, 2 * Math.PI);
    snakehead.stroke();
    snakehead.fillStyle = "#2776ff";
    snakehead.fill();
}
snake();

在 JS-fiddle 中代码可以工作，它看起来像这样：https://jsfiddle.net/j2ny6gaf/72/

我也从 JSLint 得到一些错误。

"在 var canvas = document.getElementById 上缺少使用 'strict' 语句 "将此与前面的 var 语句 var snake = canvasgetcontext 结合起来

还有一个错误； "文档未定义。[no-undef]

【问题讨论】：

两个文件都在同一个目录下，还要检查你的文件名。因为同样的代码对我有用。

标签： javascript html reference

【解决方案1】：

尝试使用脚本标签

<script type="text/javascript" src="snake.js"></script>

在头部内部。

【讨论】：

【解决方案2】：

尝试在 head 部分添加您的脚本（script src=“file-name.js” /script）并尝试添加画布大小。

【讨论】：

我的问题表述错误。我实际上可以加载画布，但我看不到我在画布上所做的绘图。但我仍然添加了你现在可以看到的建议（我用你的建议编辑了帖子），我仍然看不到我在 js 文件中制作的蛇。
好的，我现在通过将 javascript 放在 head 部分来让它工作。问题是我将 JS 放在一个单独的文件中。我仍然想知道，我什么时候应该使用不同的文件？如果我想将蛇的 Javascript 放在单独的文件中，而不是将其编码到 html 文件中。
我相信这可以帮助你adequatelygood.com/JavaScript-Module-Pattern-In-Depth.html

【解决方案3】：

试试

window.onload = function snake() {...}

【讨论】：