具有html代码的对象和要打印的方法

Question

任何人都可以帮助并查看为什么代码不起作用的问题。尝试将代码组织到一个对象中。检查代码笔链接

//trying to organize this code into an object.

// var flag0 = document.getElementById("flag0");
// var flagFranskaFlaggan = `<div class="flag frankrike"><div class="part1"></div><div class="part2"></div></div>`;
// flag0.innerHTML = flagFranskaFlaggan;

//The object!
var flag = {
    draw: function() {
        var htmlId = this.htmlId;
        var cssflag = this.cssFlag;
        htmlId.innerHTML = cssFlag;
    }
}

var flag0 = Object.create(flag);
flag0.init = function(cssFlag, htmlId) {
    this.cssFlag = cssFlag;
    this.htmlId = htmlId;
}

flag0.init(`<div class="flag frankrike"><div class="part1"></div><div class="part2"></div></div>`, flag0);
flag0.draw();

如何将flag0和document.getElementById("flag0")插入对象？

Answer 1

您需要在document.getElementById()方法中调用draw()。调用init()时，您需要将字符串作为第二个参数传递。

此外，您应该将init()方法放在对象中，而不要与之分开。

var flag = {
    draw: function() {
        document.getElmeentById(this.htmlId).innerHTML = this.cssFlag;
    },
    init: function(cssFlag, htmlId) {
        this.cssFlag = cssFlag;
        this.htmlId = htmlId;
    }
}

var flag0 = Object.create(flag);
flag0.init(`<div class="flag frankrike"><div class="part1"></div><div class="part2"></div></div>`, 'flag0');
flag0.draw();