1

私は html5 キャンバスを使用しようとしています。

    var c=document.getElementById('myCanvas');
    var ctx=c.getContext('2d');
    ctx.fillStyle="#FF0000";
    ctx.fillRect(0,0,150,75);

ここにhtmlがあります

    <!DOCTYPE html>
    <html>
    <head>
    <script type="text/javascript" src="game.js"></script>
    </head>
    <body>
    <canvas id="myCanvas" width="512" height="480" style="border:1px solid #000000;">
    </canvas>
    </body>
    </html>

何が悪いのかわからない

4

4 に答える 4

6

DOM の準備が整い、ウィンドウが読み込まれる前にスクリプトが実行される可能性があります。たとえば、次のように試してください。

window.onLoad=function(){
    var c=document.getElementById('myCanvas');
    var ctx=c.getContext('2d');
    ctx.fillStyle="#FF0000";
    ctx.fillRect(0,0,150,75);
};
于 2013-03-15T19:15:46.830 に答える
1

終了bodyタグの前にスクリプトを挿入してみてください。

好き：

...
    <script src="game.js"></script>
</body>
...
于 2013-03-15T19:49:55.417 に答える
0

DOM が読み込まれる前に取得してみていただけますか? このブロック内でコードを呼び出してみてください:

window.onload = function() {
    var c=document.getElementById('myCanvas');
    var ctx=c.getContext('2d');
    ctx.fillStyle="#FF0000";
    ctx.fillRect(0,0,150,75);
};
于 2013-03-15T19:18:32.100 に答える
0

DOM Element経由でアクセスする場合javascriptは、DOM がロードされた後に Java スクリプト コードがトリガーされることを確認し、document.onloadまたはwindow.onloadコールバックを使用して JavaScript コードをトリガーします。

コーディングをお楽しみください..

于 2013-03-15T19:27:22.483 に答える