3

<div>ページの読み込み時にページの要素にメッセージを出力したい。次の HTML および JavaScript コードがあります。

<body onload="printMsg()">
    <div id="write"></div>
</body>

function printMsg() {
    var node = document.getElementById("write");
    node.innerHTML = "<p>" + "Hello World!" + "</p>";
}

ここでは、要素onloadのイベントを使用して、ページの読み込み時<body>に呼び出します。printMsg()

しかし、イベントを使用しない場合、JavaScript 関数内に直接onload書き込む別の方法はありますか?<div id="write"></div>printMsg()

4

7 に答える 7

7

ホイップルが提案したように、あなたは次のようにそれを行うことができます：

   <body>
    <div id="write"></div>
    <script>
    (function printMsg() {
        var node = document.getElementById("write");
        node.innerHTML = "<p>" + "Hello World!" + "</p>";
    })();
    </script>
    </body>

デモ

于 2013-02-27T18:56:03.683 に答える
2

各タグを手動で記述する代わりに、単純な JavaScript 関数を記述して要素を作成できます。これは、何度も行うと混乱する可能性があります。

また、マット・ウィップルが指摘したように：

script タグが DOM 要素の後にあることを確認してください

HTML:

<body>
    <div id="write"></div>
    <script>printMsg()</script>
</body>

Javascript:

function printMsg() {
    newElement = document.createElement('p');
    newElement.innerHTML = "Hello world!";
    document.getElementById("write").appendChild(newElement);
}

http://jsfiddle.net/Qrsmq/7/

于 2013-02-27T18:59:03.193 に答える
2

以下を使用できます。

window.onload  =   function() {
    var node = document.getElementById("write");
    node.innerHTML = "<p>" + "Hello World!" + "</p>";
}

また

function printMsg() {
    newElement = document.createElement('p');
    newElement.innerHTML = "Hello world!";
    document.getElementById("write").appendChild(newElement);
}
document.body.onload = printMsg;

また

function printMsg() {
    newElement = document.createElement('p');
    newElement.innerHTML = "Hello world!";
    document.getElementById("write").appendChild(newElement);
}
window.onload  = printMsg;
于 2013-02-27T19:16:00.817 に答える
2

これらの関数を宣言内に入れることができます: $(document).ready(function() { });

これらを「スクリプト」内のヘッダーで呼び出すか、別のファイルに入れて呼び出すことができます。この宣言内のすべての関数は、ページの読み込みで実行されます。効果は onload と同じですが、body タグをいじらないでください。

于 2013-02-27T18:53:56.860 に答える
1

機能もあり.readyますが、jQueryを使用する必要があります。すでに jquery を他の目的で使用することを考えている場合は、これが最適です。DOM の準備が整うと実行されます。

しかし、最も簡単なオプションは、関数をインラインで呼び出すことですbody。

<body>
    <div id="write"></div>
    <script>
        (function(){ 
             //do something with #write
        });
    </script>
</body>

関数と同様readyに、DOM がロードされるのを待つだけであり、onloadリスナーよりも高速であり、ブラウザと JavaScript との互換性が保たれている必要があります =)

于 2013-02-27T19:05:57.590 に答える
0 
var myWeb = new Object(), _m = "model", _v = "view", _c = "controller";

myWeb.model = {

    myEle   : "log",
    myText  : "Hello World!"

}
myWeb.view = {

    doText : function() {
        document.getElementById(myWeb[_m].myEle).innerHTML = myWeb[_m].myText;
    }

}
myWeb.controller = {

    init: function() {
        if (document.readyState == "complete") {
            this.run();
        } else {
            setTimeout(myWeb[_c].init, 11);
        }
    },
    run: function() {
        myWeb[_v].doText();
    }

}
myWeb[_c].init();
于 2014-06-20T18:27:12.303 に答える