获取＆＃39; canvas1＆＃39;时出错由document.createElement创建的属性（＆＃39; canvas1＆＃39;）

Question

我正在尝试创建一个在游戏中生成地图时操作的进度条。以下是问题代码段：

COREHTML5.RoundedRectangle.prototype = {

createCanvas: function () {
    var canvas1 = document.createElement("canvas1");
    this.context1 = canvas1.getContext;
    return canvas1;
},
createDOMElement: function () {
    this.domElement = document.createElement("div");
    this.domElement.appendChild(this.context1.canvas1);
},

我收到错误：JavaScript运行时错误：无法获取属性＆＃39; canvas1＆＃39;未定义或空引用。此错误发生在代码段的最后一行。

Answer 1

  

我收到错误：JavaScript运行时错误：无法获取属性   ＆＃39; canvas1＆＃39;未定义或空引用。这个错误发生在   代码段的最后一行。

替换

 var canvas1 = document.createElement("canvas1");

与

 var canvas1 = document.createElement("canvas");//observe that '1' is removed 

因为canvas1不是有效的html元素

完整的例子可能是

function a(){}
a.prototype.createCanvas =  function () {
    var canvas1 = document.createElement("canvas");
    this.context1 = canvas1.getContext;
    return canvas1;
}
a.prototype.createDOMElement =  function () {
    this.domElement = document.createElement("div"); 
    this.domElement.appendChild(this.context1.canvas1);
}

确保在对appendChild执行之前先将div添加到DOM。