만들기 HTML5 캔버스 프로그래밍

나는 다음과 같은 HTML 코드는 예상대로 작동만들기 HTML5 캔버스 프로그래밍

<body onload="main()" > 
    ... 
    <canvas id="myId" class="myClass"></canvas> 
    ... 
</body>

을 니펫있다. 출력을 올바르게 표시 할 수 있습니다. 나는 다음과 같은 자바 스크립트 코드로 프로그램을 만들 불행히도, 그것은 작동하지 않았다

var canvas = document.createElement("canvas"); 
canvas.className = "myClass"; 
canvas.id = "myId";

을 니펫을하기 때문에

그때

<canvas id="myId" class="myClass"></canvas>

를 제거합니다. 이것으로 아무것도 표시 할 수 없습니다.

내가 뭔가를 놓친다면 궁금합니다. 어떤 도움을 주셔서 감사합니다. 미리 도움을 주셔서 감사합니다.

2011-01-22 pion

실제로 캔버스를 문서에 첨부해야합니다. 그렇게하기 전에 브라우저가 렌더링하지 않는 분리 된 요소 일뿐입니다.

var canvas = /* ... */; 
/* ... */ 
document.getElementsByTagName('body')[0].appendChild(canvas);

2011-01-22 03:23:28

@Ben, @Matt - 두 솔루션 모두 작동합니다. 이미 두 사람 모두에게 투표했습니다. 고마워요! – pion

@pion : 천만에. 나는 우리 대답이 서로 1 초 이내에 게시 된 것을 알아 챘다 ... –

DOM에 새로운 <canvas> 요소를 삽입해야합니다. 본문의 끝에 넣으려면 다음 코드를 사용하십시오.

document.body.appendChild(canvas);

(다른 요소 안에 넣으려면 document.body 대신 사용하십시오.)

2011-01-22 03:23:28

답변