Question

好的，我正在按照W3Schools的教程进行操作，我试图将这个画布放在div中。问题是，它一直回到身体的开始？我试过改变一些代码，但我不能正确！有人可以放弃一些光吗？我试图把它放在一个名为＆＃34; gameCanvas＆＃34;但我已粘贴了有效的代码。

var myGamePiece;
var myObstacles = [];
var myScore;

function startGame() {
    myGamePiece = new component(30, 30, "red", 10, 120);
    myScore = new component("30px", "Consolas", "black", 280, 40, "text");
myGameArea.start();
}

 var myGameArea = {
    canvas : document.createElement("canvas"),
start : function() {
    this.canvas.width = 480;
    this.canvas.height = 270;
    this.context = this.canvas.getContext("2d");
    document.body.insertBefore(this.canvas, document.body.childNodes[0]);
    this.frameNo = 0;
    this.interval = setInterval(updateGameArea, 20);
    },
clear : function() {
    this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);
},
stop : function() {
    clearInterval(this.interval);
}
}

提前致谢！

Answer 1

document.body.childNodes[0]是否正在尝试将画布包裹起来？

您目前在div（insertBefore）之前插入画布而不是在其中。您可以使用document.body.childNodes[0].appendChild(this.canvas)将画布作为子项添加到div。

修改

知道您要附加的div的ID为gameCanvas，以下内容应该有效：

使用document.body.insertBefore(this.canvas, document.body.childNodes[0])替换原始代码中的document.getElementById('gameCanvas').appendChild(this.canvas)。

HTML画布的问题？

1 个答案: