Canvas는 HTML 파일에서 작동하지만 javascript 파일에서는 작동하지 않습니다.

방금 처음으로 JavaScript 책 "Head First HTML5"를 완성했으며 꽤 바보였습니다. 스크립트를 HTML 파일에 넣으면 작동하지만 별도의 JavaScript 파일에서는 작동하지 않습니다.Canvas는 HTML 파일에서 작동하지만 javascript 파일에서는 작동하지 않습니다.

HTML 파일 :

<!DOCTYPE html> 
<head> 
<meta charset="UTF-8"> 
<script src="canArt.js"></script> 
</head> 
<body> 
<canvas id="canvas" width="800" height="800"></canvas> 
</body> 
</head>

JS 파일 :

window.onload = init(); 
function init() { 
var canvas = document.getElementById("canvas"); 
var ctx = canvas.getContext("2d"); 

ctx.fillStyle = "rgb(200,0,0)"; 
ctx.fillRect (10, 10, 55, 50); 

ctx.fillStyle = "rgba(0, 0, 200, 0.5)"; 
ctx.fillRect (30, 30, 55, 50); 
}

이 도움을 주시기 바랍니다.

출처

2012-01-09 bender850

내 즉시 괄호를 포함하고 onload 처리기 아무것도 없다 init 결과를 할당하여 init 기능 ...

변화 실행 :

window.onload = init();

행 :

을

window.onload = init;

http://jsfiddle.net/sFmNw/

출처

2012-01-09 02:37:04 xandercoded

즉,'= init();은 즉시 init 함수를 실행하고 반환 값을 window.onload에 할당하고,'= init; '이라고 말하면 함수 자체를 onload 핸들러로 지정합니다. –

<이마에 손을> 와우, 내가 그걸 놓친 걸 믿을 수 없어. 고마워. – bender850

사이트에 감사드립니다. – bender850

Canvas는 HTML 파일에서 작동하지만 javascript 파일에서는 작동하지 않습니다.

답변

관련 문제