[英]Uncaught TypeError: Cannot read property 'getContext' of null
在我的控制台中，我收到錯誤消息：“未捕獲的類型錯誤：無法讀取 null 的屬性 'getContext'”，但我找不到我犯的錯誤……或者我做錯了什么。 所以也許你能幫我找到它？ 請幫忙 ：）
enter code here
var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");
var cW = canvas.width = 1000;
var cH = canvas.height = 500;
var particleAmount = 10;
var particles = [];
for(var i=0;i<particleAmount;i++) {
particles.push(new particle());
}
function particle() {
this.x = (Math.random() * (cW-(40*2))) + 40;
this.y = (Math.random() * (cH-(40*2))) + 40;
this.xv = Math.random()*20-10;
this.yv = Math.random()*20-10;
}
function draw () {
ctx.fillStyle = "black";
ctx.fillRect(0,0,cW,cH);
for(var ii=0;ii<particles.length;ii++){
var p = particles[ii];
ctx.fillStyle = "red";
ctx.beginPath();
ctx.arc(p.x,p.y,40,Math.PI*2,false);
ctx.fill();
}
}
setInterval(draw,30);
該錯誤基本上意味着 HTML 和 JavaScript 代碼沒有正確協作，或者只是您沒有正確加載腳本。
嘗試這個：
function init() {
// Run your javascript code here
}
// Run the 'init' function when the DOM content is loaded
document.addEventListener("DOMContentLoaded", init, false);
希望這可以幫助。
答案就在問題之后的評論中！ 其他人也在下面發布了它作為答案，但所有功勞都歸功於：@elclanrs
“是的，所以畫布還不存在。在畫布元素之后加載腳本。 – elclanrs 2014 年 9 月 13 日 22:43”
我認為您將腳本標簽放在畫布標簽上方，請將其放在畫布標簽之后。
將腳本文件放在畫布之后。 這意味着在 body 標簽之前放下你的腳本。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML5 Canvas</title>
<link rel="shortcut icon" href="assets/1.png">
<link rel="stylesheet" href="assets/canvas.css">
</head>
<body>
<div class="container">
<h2>Canvas</h2>
<canvas id="myCanvas" width="400" height="300">
</canvas> <!-- End Canvas -->
</div> <!-- End Container -->
<script src="canvas.js"></script>
</body>
</html>
嘗試在腳本標記之前聲明畫布元素。 它對我來說很好。
未捕獲的TypeError：無法讀取null的屬性'getContext'
[英]Uncaught TypeError: Cannot read property 'getContext' of null
未被捕獲的TypeError：在zoom.html：8處無法讀取null的屬性“ getContext”
[英]Uncaught TypeError: Cannot read property 'getContext' of null at zoom.html:8
未捕獲的TypeError：無法讀取null Node.js的屬性'getContext'
[英]Uncaught TypeError: Cannot read property 'getContext' of null Node.js
錯誤：未捕獲的類型錯誤：無法讀取 null 的屬性“getContext”
[英]error: Uncaught TypeError: Cannot read property 'getContext' of null
未捕獲的TypeError：無法讀取未定義的屬性'getContext'
[英]Uncaught TypeError: Cannot read property 'getContext' of undefined
問題：嘗試使用 Javascript 編碼時，“未捕獲的類型錯誤：無法讀取 null 的屬性‘getContext’”。 更多信息如下
[英]Problem with : "Uncaught TypeError: Cannot read property 'getContext' of null" when trying to code with Javascript. Further information below
我不知道該怎么辦，因為發生錯誤-> Uncaught TypeError：無法讀取null的屬性'getContext'
[英]I don't know what to do because an error occurs --> Uncaught TypeError: Cannot read property 'getContext' of null
在畫布上繪制時出現“未捕獲的TypeError：無法讀取未定義的屬性'getContext'”
[英]“Uncaught TypeError: Cannot read property 'getContext' of undefined” when drawing on canvas
收到此錯誤 - 未捕獲的類型錯誤：無法讀取未定義的屬性“getContext”
[英]Receiving this error - Uncaught TypeError: Cannot read property 'getContext' of undefined
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.