So, I just want to confirm that the line of code directly below this sentence means the canvas should be inserted before any other elements, right?
document.body.insertBefore(this.canvas, document.body.childNodes[0]);
The full code is below, but it’s really the last line I’m looking for confirmation about. I’m leaving notes behind for myself while I code through a tutorial.
function startGame() {
myGameArea.start();
}
//an object, game area to be used in function of the game.
var myGameArea = {
// Canvas creation for when game is created.
canvas : document.createElement("canvas"),
//start key being given a function to give the canvas created above a width, height and 2d context.
//Last line of the start key ensuring canvas is inserted before any future components.
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]);
}
}
//the function start game accesses the object game area and start key. The start key, accesses the canvas key
// and then creates the canvas with the specifications of the start key.
//The CSS styles in the head give styling decoration to the canvas and with the start game function triggered when the
//browser loads, the canvas is created.