1

ここに基本的なプログラムがありますが、これが機能しない理由がわかりません:

オブジェクト クラス houseObject.js:

var string;

    function createSentence(paragraph){
        this.string = paragraph;
    }

    function getString(){

        return string;  
    }

実行するプログラム:

<!DOCTYPE html>
<html>
<head>

<script type = "text/javascript" src="houseObject.js"></script>
<script>

   var temp = new createSentence("hello world");
   var string = temp.getString();
    var para=document.createElement("p");
    var node=document.createTextNode(string);
    para.appendChild(node);


</script>

</head>


<body>

<div id="div1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
</div>

<script>
    var element=document.getElementById("div1");
    element.appendChild(para);
</script>
</body>
</html>

私の2番目の質問は、なぜ私は置くことができないのですか

    var element=document.getElementById("div1");
    element.appendChild(para);

html の head セクション内。html はスクリプトプログラムなので、body セクションをまだ読んでいないのでしょうか。

前もって感謝します

4

4 に答える 4

2

残念ながら、Javascript でオブジェクトがどのように機能するかを十分に理解していません。グローバルに定義しているように見えるものthis.nameと同じではありません 。nameJavascript のオブジェクトの詳細については、「オブジェクト指向 Javascript の紹介」を参照してください。

于 2013-08-05T22:38:19.060 に答える
2

オブジェクトを取得するコンストラクタ関数を作成できます。

var Sentence = function (text) {
    this.text = text;
};

今あなたがするなら

var obj = new Sentence("Hello World");

があり、obj instanceof Sentence次のようにプロパティにアクセスできます

console.log(obj.text); // prints Hello World

これをDOM要素に「添付」することは、他の大きな答えです。DOMElement でオブジェクトを直接参照するのが危険な理由については、この質問を参照してください。jQuery.dataから始めるか、ID/オブジェクトのタプルを格納するための配列または別のオブジェクトを作成する必要があるかもしれません。

var list = [ obj0, obj1 ];

var keyValueStore = { "key0": obj0, "key1" : obj1 };

コンストラクター関数とそのオブジェクト インスタンスをさらに拡張します。

var Sentence = function (text) {
    this.para = document.createElement("p");
    this.setText(text);
};

Sentence.prototype.setText = function (text) {
    if (this.node) {
        this.para.removeChild(this.node);
    }
    this.node = document.createTextNode(text);
    this.para.appendChild(this.node);
};

Sentence.prototype.getText = function () {
    if (this.node) {
        if (!this.node.textContent) {
            // typical IE hack
            return this.node.innerText;
        }
        return this.node.textContent;
    }
};

使用法：

window.onload = function () {

    var sentence0 = new Sentence("Hello World");

    document.body.appendChild(sentence0.para);

    setTimeout(function () {
        sentence0.setText("I'm Edward!");
    }, 5000);

};

Fiddle: http://jsfiddle.net/tfets/ (jsFiddle は window.load ハンドラーを自動ラップします)。

于 2013-08-05T22:47:38.400 に答える
1

あなたは正しいです。HTML ドキュメントは順次読み込まれ、見つかったときに JS コードが実行されます。内のスクリプトは、まだ読み取られていないため、<head>内のノードにアクセスできません。<body>

于 2013-08-05T22:36:45.097 に答える
1

オブジェクトで作業している場合は、次のようにプロトタイプを使用します。

function createSentence(paragraph){
    this.paragraph = paragraph;
}

createSentence.prototype.getString = function(){
    alert(this.paragraph);
    //Or return this.paragraph
}

var string_1 = new createSentence('my sentence');
var string_2 = new createSentence('another sentence');

string_1.getString();
//Will return 'my sentence'

string_2.getString();
//Will return 'another sentence'
于 2013-08-05T22:52:32.690 に答える