1

以下のコードでは、グローバル変数「myDiv」に jQuery 要素を割り当てています。しかし、「test()」関数内では、myDiv 変数が宣言されているようですが、定義されていないようです。何かを行う前に、もう一度 $('myDiv') を再割り当てする必要があります。

ただし、偽の変数 xyz には問題なく到達できるようです...

<!DOCTYPE html>
<htm>
<head>
<title>Javascript Test Code</title>
<script src="js/jquery-1.9.0.min.js"></script>
<script>

var App = App || (function () {

  var myDiv = $('#myDiv'), // define a global jQuery element variable.  
        xyz = 'xyz';       // and a bogus variable as a test.  

  function test()
  {
    console.log('running test...','myDiv is', myDiv); // length is 0
    console.log('xyz is ', xyz); // says xyz

    myDiv = $('#myDiv'); // after selecting with jQuery...

    console.log('running test...','myDiv is', myDiv); //length is 1
    console.log('xyz is ', xyz); // still says xyz
  }

  return {test:test} 

}());

$(function(){

  App.test();

});

</script>
</head>
<body>
<div id="myDiv"></div>
</body>
</html>
4

2 に答える 2

2

何もレンダリングされないため、ドキュメントの先頭から要素にアクセスすることはできません。この行

var App = App || (function () {

その時点でのアプリは未定義であるため、自己実行機能を実行します。

自己実行関数が実行されると、検索されます$('#myDiv')が、要素が存在しないため、検出されません(これが、セレクターに一致する要素配列の長さが0になる理由です)。

後でアクセスしようとするAppと、すでにビルドされています。

$(function(){
 App.test();
});

つまり、への呼び出しは、自己実行関数からAppすでに構築されたものを返します。値は、ドキュメントの先頭で実行されたときからすでに保存されています。App

関数を呼び出すと、testロードされた状態が反映されます。ただし、発行する関数は低くなります

myDiv = $('#myDiv'); // after selecting with jQuery...

ページがすでにロードされたら(jqueryreadyコールバックの内部にいるため)。DOMはすでにレンダリングされているため、これによりページ上の要素が検索され、値が更新されます。

于 2013-02-21T00:44:00.643 に答える
0

上記の特定のサンプルコードでは、Appが宣言されたときに、DOMが完全にロードされておらず、の長さ#myDivが正しくゼロであるため、最初のmyDivは空です。

DOMがロードされた後、つまり、実行するモジュールを移動する必要があります。スクリプトの一番下に移動します。

jsFiddleの例を参照してください-割り当ては問題ありません。http://jsfiddle.net/yWhbL/

于 2013-02-21T00:45:21.267 に答える