Javascript 未上色的帆布_Javascript_Canvas

Javascript 未上色的帆布

javascript canvas

Javascript 未上色的帆布,javascript,canvas,Javascript,Canvas,我正在按照教程用颜色填充画布。没有着色发生。这可能是因为函数update（）和函数draw（）是空的吗 <!DOCTYPE html> <html> <head> <title>Basic Example</title> <script src="BasicExample.js"> </script> </head> <

我正在按照教程用颜色填充画布。没有着色发生。这可能是因为函数update（）和函数draw（）是空的吗

<!DOCTYPE html>
<html>
    <head>
        <title>Basic Example</title>
        <script src="BasicExample.js">  
        </script>
    </head>
    <body>
        <div id="gameArea">
            <canvas id="myCanvas" width="800" height="480"></canvas>
        </div>
    </body>
</html>

您的功能更新应该是功能更新->在“功能”一词上输入错误

请参阅下面更正的html/脚本：

<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
<div id="gameArea">
    <canvas id="myCanvas" width="800" height="480"></canvas>
</div>
<script>
var canvas = undefined;
var canvasContext = undefined;

function start () {
    canvas = document.getElementById("myCanvas");
    canvasContext = canvas.getContext("2d");
    gameLoop();
}

document.addEventListener('DOMContentLoaded', start);

function update() {
}

function draw() {
}

function gameLoop () {
    canvasContext.fillStyle = "blue";
    canvasContext.fillRect(0, 0, canvas.width, canvas.height);
    update();
    draw();
    window.setTimeout(gameLoop, 100 / 60);
}   
</script>
</body>
</html>


无标题文件
var=canvas未定义；
var canvasContext=未定义；
函数启动（）{
canvas=document.getElementById（“myCanvas”）；
canvasContext=canvas.getContext（“2d”）；
gameLoop（）；
}
document.addEventListener（'DOMContentLoaded'，start）；
函数更新（）{
}
函数绘图（）{
}
函数gameLoop（）{
canvasContext.fillStyle=“蓝色”；
canvasContext.fillRect（0,0，canvas.width，canvas.height）；
更新（）；
draw（）；
设置超时（gameLoop，100/60）；
}

Typo:

function

。使用（点击

F12

）并读取任何错误。

<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>

<body>
<div id="gameArea">
    <canvas id="myCanvas" width="800" height="480"></canvas>
</div>
<script>
var canvas = undefined;
var canvasContext = undefined;

function start () {
    canvas = document.getElementById("myCanvas");
    canvasContext = canvas.getContext("2d");
    gameLoop();
}

document.addEventListener('DOMContentLoaded', start);

function update() {
}

function draw() {
}

function gameLoop () {
    canvasContext.fillStyle = "blue";
    canvasContext.fillRect(0, 0, canvas.width, canvas.height);
    update();
    draw();
    window.setTimeout(gameLoop, 100 / 60);
}   
</script>
</body>
</html>