HTML canvas的问题？

好吧，所以我正在遵循W3Schools的教程，并试图将此画布放在div中。问题是，它一直回到身体的开始？我试着改变一些代码，但我只是不能正确地做出决定！有人可以摆脱一些光的任何机会？我试图把它放在一个名为“gameCanvas”的div，但是我粘贴了可用的代码。HTML canvas的问题？

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); 
} 
}

在此先感谢！

来源

2016-12-15 connorrickk

是document.body.childNodes[0]你试图用帆布包裹的div吗？

您目前将您的画布插入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)。

来源

2016-12-15 18:25:21 Bastiaanus

感谢您的迅速回复，尽管我似乎无法完成它的工作。我可能真的是金发..无论哪种方式该股试图将其添加到它被称为“gameCanvas”，我张贴的代码是从测试文件，看看为什么它不工作.. – connorrickk

你现在有任何错误？你可以尝试使用'document.getElementById（'gameCanvas'）'而不是'document.body.childNodes [0]'？如果它仍然不能正常工作，那么如果你能提供一个展示问题的jsfiddle会很有帮助。 – Bastiaanus

https://jsfiddle.net/2t0685ts/看看那个，它可能是一些非常简单的东西，我是JS新手，不要对我太苛刻！ – connorrickk

HTML canvas的问题？

回答

相关问题