html canvas不填充颜色

问题描述：

我一直在关注如何制作简单画布的教程。但是，即使我完全按照教程操作，画布仍不会以任何颜色显示。任何帮助。其窃听我：/html canvas不填充颜色

<html> 

some text here 

<canvas id="gamecanvas" width="800" height="600></canvas>] 

<script> 
var Canvas; 
var canvasContext; 

window.onload = function() { 
    console.log("Hello world!"); 
    Canvas = document.getElementById("gamecanvas"); 
    canvasContext = canvas.getcontext('2d'); 
    canvasContext.fillStyle = 'red'; 
    canvasContext.fillRect(0,0,canvas.width,canvas.height); 
}  
</script> 
</html>

编辑：感谢您的帮助。解决了！

您的混合'canvas'和'Canvas'。在js案件事宜 – llamerr

这个问题如何得到票？一个有错误的代码如何能对某人有帮助？ –

随时标记帮助你的答案正确的答案 – Yannjoel

答

语法错误太多。

这是工作

<html> 

some text here 

<canvas id="gamecanvas" width="800" height="600"></canvas> 

    <script> 
    var Canvas; 
    var canvasContext; 

    window.onload = function() { 
     console.log("Hello world!"); 
     Canvas = document.getElementById("gamecanvas"); 
     canvasContext = Canvas.getContext('2d'); 
     canvasContext.fillStyle = 'red'; 
     canvasContext.fillRect(0,0,Canvas.width,Canvas.height); 

    }  
    </script> 
</html>

这就是为什么我得到否定票？ –

答

你已经做了两个错误

您在混合canavs和Canvas
你已经写了getContext有没有资本c

不要忘了变量和方法名在JavaScript中是casesensitve。

因此canavas不是与Canavs相同的变量，而getcontext('2d')与getContext('2d')不是同一个方法。

继承人小提琴中，我已经改正了错误：

var canvas; 
 
var canvasContext; 
 

 
window.onload = function() { 
 
    console.log("Hello world!"); 
 
    canvas = document.getElementById("gamecanvas"); 
 
    canvasContext = canvas.getContext('2d'); 
 
    canvasContext.fillStyle = 'red'; 
 
    canvasContext.fillRect(0,0,canvas.width,canvas.height); 
 

 
}

some text here 
 
<canvas id="gamecanvas" width="800" height="600"></canvas>

html canvas不填充颜色

相关推荐