如何在DIV中添加html5 CANVAS

aSy*_*oad 5 html javascript html5 canvas

我正在使用以下代码生成一个canvas.目前它将canvas元素添加到body,我如何才能将它添加到div命名的"divGameStage",它不嵌套在任何其他元素中,除了body.

编辑:我已经尝试了第一个建议,但没有出现画布,完整代码如下:

<head>
<meta charset="utf-8">
<title>Game Stage</title>
<script type="text/javascript">
    function loadCanvas(id) {
        var canvas = document.createElement('canvas');
        div = document.getElementByID(id); 
        canvas.id     = "CursorLayer";
        canvas.width  = 1224;
        canvas.height = 768;
        canvas.style.zIndex   = 8;
        canvas.style.position = "absolute";
        canvas.style.border   = "1px solid";
        div.appendChild(canvas)
    }
        </script>
</head>
<body>
<header>
    <h1>The most important heading on this page</h1>
    <p>With some supplementary information</p>
</header>
<div id="divControls"></div>
<div id="divGameStage"></div>
<script type="text/javascript">
    loadCanvas(divGameStage);
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

GOK*_*GOK 9

试试这段代码,肯定会对你有用:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Game Stage</title>
<script type="text/javascript">
    function loadCanvas(id) {
        var canvas = document.createElement('canvas');
        div = document.getElementById(id); 
        canvas.id     = "CursorLayer";
        canvas.width  = 1224;
        canvas.height = 768;
        canvas.style.zIndex   = 8;
        canvas.style.position = "absolute";
        canvas.style.border   = "1px solid";
        div.appendChild(canvas)
    }
        </script>
</head>
<body>
<header>
    <h1>The most important heading on this page</h1>
    <p>With some supplementary information</p>
</header>
<div id="divControls"></div>
<div id="divGameStage"></div>
<script type="text/javascript">
    loadCanvas("divGameStage");
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

有些事情要记住:1.错误1号缺少loadCanvas中的引号("divGameStage"); 2.错误No 2是语法错误div = document.getElementById(id); "..ID(id)"在您的代码中.

如果那时它也不起作用那么我确定你在Internet Explorer上测试它(特别是<IE9) - 如果是这样的话,FYI IE9及以上支持画布没有其他较小的版本支持画布

干杯!!!