Hi, I am new to javascript. Syntactically, this code seems correct, but for some strange reason, it refuses to execute. I know it's bad practice to include the script within the same document, but I just want this to work. Thank you in advance.

 <!DOCTYPE html>
 <html>
        <head>
            <title>
                Test
                </title>

                <body>
                    <p>
                        Hello World.
                        </p>
                        <br>
                        <p id = "bye">
                            </p>

                        <canvas id="canvas1" width="200" height = "100" style="border:1px solid #000000;"> 
                            </canvas>

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

                                document.getElementById("bye").innerHTML = "bye";
                                </script> 
                    </body>
            </head>
    </html>

Recommended Answers

All 3 Replies

Hi,
I think that you need to change
var c=document.getElementById("myCanvas");
Into
var c=document.getElementById("canvas1");
myCanvas for canvas1.
canvas1 is the id that you have done to it.

Thank you very much.

On your code you written entire body in head seaction. try to keep seperately.

<html>
    <head>
        <title>You'r document title here</title>
    </head>
    <script>
        // your script goes here
    </script>
    <body>
        <!-- Content goes here -->
        <script>
            // Your script goes here
        </script>
    </body>
</html>

to avoid errors.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.