从HTML画布中分离Javascript代码_Javascript_Html_Canvas

从HTML画布中分离Javascript代码

javascript html canvas

从HTML画布中分离Javascript代码,javascript,html,canvas,Javascript,Html,Canvas,我正在尝试学习HTML5画布，它是从javascript代码中提取的似乎我无法将Javascript代码与原始html分开。一直在寻找一些解决方案：这些都不是我的解决方案，因为在我实现了这两个解决方案之后，我看到的是空白画布这是我的密码 <!DOCTYPE html> <html> <head> <title>Christoper Hans' Paint HTML5 Project</title> <

我正在尝试学习HTML5画布，它是从javascript代码中提取的

似乎我无法将Javascript代码与原始html分开。一直在寻找一些解决方案：

这些都不是我的解决方案，因为在我实现了这两个解决方案之后，我看到的是空白画布

这是我的密码

<!DOCTYPE html>
<html>
<head>
    <title>Christoper Hans' Paint HTML5 Project</title>
    <link rel="stylesheet" type="text/css" href="paint.css">
    <script type="text/javascript"><!--
        window.addEventListener('load', function () {
            var ctx = document.getElementById("paint").getContext("2d");
            ctx.canvas.width  = window.innerWidth;
            ctx.canvas.height = window.innerHeight;

            function drawRect(ctx, x1, y1, x2, y2, fill) {

            ctx.fillStyle=fill;
            ctx.fillRect(x1, y1, x2, y2);
            }

            drawRect(ctx, 100, 100, 200, 250, "FF0000");
        }, false);
// --></script>

</head>
<body>
    <canvas id="paint" width="500" height="500" style="border:1px solid #c3c3c3;">
    Your browser does not support the HTML5 canvas tag.
    </canvas>
</body>


克里斯托普·汉斯的绘画HTML5项目
您的浏览器不支持HTML5画布标记。

我不知道为什么，但只有我从这个网站的帖子中得到的这种代码有效，我无法将javascript与外部文件分离

TL；DR：想要将javascript与html分离以使用画布

有人帮忙吗？

我猜你也在把

复制到你的外部文件中。如果是这样，就不要这样做。你甚至不应该再使用这些了，除非你是为了迎合上个世纪的浏览器。

对不起，伙计们。正是我的输入错误使得任何外部javascript都无法加载。

@CBroe指出了这一点，现在一切似乎都在起作用。

我不理解这个问题。你能重新措辞吗？你介意在你的浏览器控制台中发布你收到的任何错误代码吗？自从Netscape 3以来，在

标记周围放置块HTML注释是不需要的…@akonsu在TL上添加了一些简短的描述；乔博士在浏览器控制台上似乎没有任何错误@Alnitak我无法找到任何其他解决方案。请给我这个古老的密码以外的选择刚才试过了。似乎不太管用。你能给我一个替代方案吗？我使用此代码的唯一原因是因为它是我的计算机上唯一可用的代码。我什么也没看到。。尝试在铬上打开检查元件。还是我打开的东西错了？当你打开inspector时，你是否看到inspector窗口右下角有一个红色的X和一个数字？找不到。然而，当我看到inspector的Network选项卡时，似乎根本没有加载javascript。我的javascript链接有问题吗？代码还必须确保javascript也被命名为paint.js。

type=“text/javasript”

——是真的，还是在这里发布时只是输入错误？