javascript 对象原型(prototype)属性未更新

Question

我是 javascript 新手，所以在创建对象，然后通过原型(prototype)设计更改它的属性时遇到一些问题。

这是我的代码:

function test() {
    this.xCssClass = "placeholder";
    this.init = function () {
        var btn = document.createElement("div");
        btn.className = this._CssClass;
        this.Node = btn;
    }
    this.Node;
    this.CreateInterface = function () {
        var btn = document.createElement("div");
        this.Node = btn;
    }
    this.init();
}
test.prototype.CssClass = {
    get CssClass() {
        return this._CssClass;
    },
    set CssClass(arg){
        this.xCssClass = arg;
        this.className = "args";
    }
}
var x = new test();
document.body.appendChild(x.Node);

x.xCssClass="GHR"
Debug.WriteLine(x.xCssClass);

当我尝试重新定义 cssclass 时，它会重新定义，但不会更新添加到 Dom 的对象。我希望能够去:x.xCssClass="一些 css 类"并在 javascript 和 dom 中更新 x 对象。目前仅在 JavaScript 中进行更新。我做错了什么？我是否混淆了实例？任何帮助，将不胜感激。谢谢

Answer 1

一旦将其追加到 DOM，您就需要手动更新它。

您可以执行以下操作:

function test() {
    this.xCssClass = function(class){
      this.Node.className += ' '+ class;
    };
    this.init = function () {
        var btn = document.createElement("div");
        btn.className = this._CssClass;
        this.Node = btn;
    }
    this.Node;
    this.CreateInterface = function () {
        var btn = document.createElement("div");
        this.Node = btn;
    }
    this.init();
}

现在，您可以执行以下操作:

x.xCssClass("GHR");