Javascript基本原型-无法更新属性

我正在尝试创建我的第一个Javascript“原型”。它包括在google map V3上创建一个标签，我在其中编写的内容类似于在长时间操作中“加载标记”。
但是，我想“重用”我的原型，并更改用它编写的文本。在形状加载操作等过程中，“加载标记”可以变成“加载形状”

以下是我到目前为止所写的内容：

StateControl.prototype.text_ = null;

// Define setters and getters for this property
StateControl.prototype.getText = function () {
    return this.text_;
}

StateControl.prototype.setText = function (text) {
    this.text_ = text;
}

/** @constructor */
function StateControl(controlDiv, map, text) {

    var control = this;
    control.text_ = text;

    controlDiv.style.padding = '5px';

    // Set CSS for the control border
    var stateUI= document.createElement('div');
    //some css properties like stateUI.style.backgroundColor = 'black'
    controlDiv.appendChild(stateUI);

    // Set CSS for the control interior
    var goHomeText = document.createElement('div');
    stateUI.id = 'stateControl';
    //some css properties like stateText.style.color = 'white';
    stateText.innerHTML = '<strong>' + this.text_ + '</strong>';
    stateUI.appendChild(stateText);
}

在初始化过程结束时，我使用

$("#stateControl").fadeOut(3000);

——这很有效--


但是现在，当用户单击一个名为“加载形状”的单选按钮时，我需要更改

StateControl

的文本。我希望

StateControl

fadeIn（）

立即将“加载形状”作为文本，然后在加载形状时

fadeOut（3000）

。我知道如何使用

fadeIn（）

我试过了

homeControl = StateControl.prototype.setText("Loading the shapes");

在我的
loadShapes（）
方法中，但它只有在我创建了一个新的
StateControl
和好的文本时才起作用。。。但这是一种浪费，我只需要更新
text.
属性

我怎样才能做到这一点呢？
您似乎对原型和javascript中的对象创建感到困惑。我会尽量做简短的介绍

在javascript中，我们有时使用函数作为构造函数，这与您正确使用的一样：

function StateControl(controlDiv, map, text) {
    // body
}

通过构造函数，您可以使用
new
关键字创建实例：

var myStateControl = new StateControl(stateControlDiv, map, "Loading the map");

简而言之，有两种方法，即如何向实例添加属性。使用构造函数内部的
此
关键字或构造函数的
原型
属性。区别很简单。每次创建新实例时都会调用构造函数，但原型只需定义一次

重要信息，原型属性必须在构造函数之后定义：

function StateControl(controlDiv, map, text) {
}

StateControl.prototype.getText = function () {
    return this.text_;
}

StateControl.prototype.setText = function (text) {
    this.text_ = text;
}

因为您在每个实例中都定义了文本，所以您不必为
StateControl.prototype.text\u0=null

我不知道你剩下的代码是什么样子的，但是试着改变一下你的方法。您需要更改某些html中的文本，因此需要从实例到该html元素的连接。还有getter和setter，但是实例属性在没有它们的情况下是可以访问的

function StateControl(controlDiv, map, text) {
    this.text_ = text;
    //so lets just make stateText as a property of this
    this.stateText = document.createElement('p');

    controlDiv.style.padding = '5px';

    // Set CSS for the control border
    var stateUI= document.createElement('div');
    //some css properties like stateUI.style.backgroundColor = 'black'
    controlDiv.appendChild(stateUI);

    // Set CSS for the control interior
    var goHomeText = document.createElement('div');
    stateUI.id = 'stateControl';
    //some css properties like stateText.style.color = 'white';
    this.stateText.innerHTML = '<strong>' + this.text_ + '</strong>';
    stateUI.appendChild(this.stateText);
}

// and lets make method that will be able to change state text...
StateControl.prototype.setStateText = function (text) {
    this.text_ = text;
    this.stateText.innerHTML = '<strong>' + this.text_ + '</strong>';
};

// then somewhere in the code... 
$("#loadShapes").on("click", function() {
    stateControl.setStateText("Loading the shapes");
    $("#stateControl").fadeIn...
}

函数状态控件（controlDiv、map、text）{
this.text=text；
//所以让我们把stateText作为它的一个属性
this.stateText=document.createElement（'p'）；
controlDiv.style.padding='5px'；
//为控件边框设置CSS
var stateUI=document.createElement（'div'）；
//一些css属性，如stateUI.style.backgroundColor='black'
controlDiv.appendChild（stateUI）；
//为控件内部设置CSS
var goHomeText=document.createElement（'div'）；
stateUI.id='stateControl'；
//一些css属性，如stateText.style.color='white'；
this.stateText.innerHTML=''+this.text''；
stateUI.appendChild（this.stateText）；
}
//让我们制作一个能够改变状态文本的方法。。。
StateControl.prototype.setStateText=函数（文本）{
this.text=text；
this.stateText.innerHTML=''+this.text''；
};
//然后在代码的某个地方。。。
$（“#加载形状”）。在（“单击”，函数（）{
stateControl.setStateText（“加载形状”）；
$（“#stateControl”）.fadeIn。。。
}
您似乎对原型和javascript中的对象创建感到困惑。我将尝试做简短的介绍

在javascript中，我们有时使用函数作为构造函数，这与您正确使用的一样：

function StateControl(controlDiv, map, text) {
    // body
}

通过构造函数，您可以使用
new
关键字创建实例：

var myStateControl = new StateControl(stateControlDiv, map, "Loading the map");

简而言之，有两种方法，如何向实例添加属性。使用构造函数中的
this
关键字或使用构造函数的
prototype
属性。区别非常简单。每次创建新实例时都会调用构造函数，但只需定义一次原型

重要信息，原型属性必须在构造函数之后定义：

function StateControl(controlDiv, map, text) {
}

StateControl.prototype.getText = function () {
    return this.text_;
}

StateControl.prototype.setText = function (text) {
    this.text_ = text;
}

因为您在每个实例中都定义了文本，所以您不必为
StateControl.prototype.text\uuz=null；
操心

我不知道你剩下的代码是什么样子，但是试着改变一下你的方法。你需要改变一些html中的文本，所以你需要从实例到那个html元素的连接。你也有getter和setter，但是实例属性没有它们是可以访问的

function StateControl(controlDiv, map, text) {
    this.text_ = text;
    //so lets just make stateText as a property of this
    this.stateText = document.createElement('p');

    controlDiv.style.padding = '5px';

    // Set CSS for the control border
    var stateUI= document.createElement('div');
    //some css properties like stateUI.style.backgroundColor = 'black'
    controlDiv.appendChild(stateUI);

    // Set CSS for the control interior
    var goHomeText = document.createElement('div');
    stateUI.id = 'stateControl';
    //some css properties like stateText.style.color = 'white';
    this.stateText.innerHTML = '<strong>' + this.text_ + '</strong>';
    stateUI.appendChild(this.stateText);
}

// and lets make method that will be able to change state text...
StateControl.prototype.setStateText = function (text) {
    this.text_ = text;
    this.stateText.innerHTML = '<strong>' + this.text_ + '</strong>';
};

// then somewhere in the code... 
$("#loadShapes").on("click", function() {
    stateControl.setStateText("Loading the shapes");
    $("#stateControl").fadeIn...
}

函数状态控件（controlDiv、map、text）{
this.text=text；
//所以让我们把stateText作为它的一个属性
this.stateText=document.createElement（'p'）；
controlDiv.style.padding='5px'；
//为控件边框设置CSS
var stateUI=document.createElement（'div'）；
//一些css属性，如stateUI.style.backgroundColor='black'
controlDiv.appendChild（stateUI）；
//为控件内部设置CSS
var goHomeText=document.createElement（'div'）；
stateUI.id='stateControl'；
//一些css属性，如stateText.style.color='white'；
this.stateText.innerHTML=''+this.text''；
stateUI.appendChild（this.stateText）；
}
//让我们制作一个能够改变状态文本的方法。。。
StateControl.prototype.setStateText=函数（文本）{
this.text=text；
this.stateText.innerHTML=''+this.text''；
};
//然后在代码的某个地方。。。
$（“#加载形状”）。在（“单击”，函数（）{
stateControl.setStateText（“加载形状”）；
$（“#stateControl”）.fadeIn。。。
}
您是否尝试过stateControl.setText（“加载形状”）；？是的，我尝试过，但控制台中出现以下错误：
TypeError:stateControl.setText不是一个函数
我给出了一些答案，但它只是一个盲点。让我确认一下