将JavaScript错误视为未捕获TypeError：无法读取属性＆getContext为null

Question

这是代码，它只是一个简单的动画。 代码是在仍然出现此错误后编写的，为什么不加载？

    <script>
        /**This is written outside Canvas tag, Why am I getting Uncought TypeError:cannot read property 'getContext of null**/


        var canvas = document.getElementById("mycanvas");

        var ctx = canvas.getContext("2d");
        var update = function(){
            x = x + speed; 
        };

        var draw = function(){
            ctx.clearRect(0,0,500,300);
            ctx.fillStyle = "rgb(200,0,100)";
            ctx.fillRect(x,y,w,h);
        };

        var step = function(){

            update();
            draw();
            window.requestAnimationFrame(step);


        };
        step();

    </script>