javascript - 为什么我必须使用 window.onload 将图像绘制到画布上

Question

我正在尝试将图像绘制到画布上，但代码：

ctx.drawImage(ground, 0, 0);

本身不起作用。有人向我指出，这是因为执行该行时未加载 html。有人建议我使用此代码，该代码有效：

window.onload = function(){
    ctx.drawImage(ground, 0, 0);
}

我不明白为什么这会起作用，因为我认为类似的解决方案是将脚本标记放在我所做的主体下方，但这不起作用。有人可以用蹒跚学步的孩子能理解的方式向我解释一下吗？

标签： javascripthtml

Answer 1

首先，在网页中首先执行 JavaScript，然后再加载正文中的文本。因此，<script>在语法上将标签放置在任何地方都无关紧要，因为它会首先加载。在ctx.drawImage(ground, 0, 0);页面渲染之前运行，因此您看不到输出。

Window.onload是一种在整个文档呈现后运行其中的函数的方法。在渲染并运行函数后，您将看到所需的输出。