jqueryでDOM要素を正しくキャッシュする方法

Question

名前空間変数からキャッシュされたDOM要素にアクセスするのに問題があります。 FeedManagerの設定変数は次のとおりです。

var FeedManager = { 
    config : { 
     $feedContainer : $('#feedContainer'), 
     feedUrl : 'http://rss......', 
     feedLimit : 10 
    },.... 

ここで、$ feedContainerはhtmlのul要素です。フィードから構築されたli要素を追加したかったのです。私はFeedManagerオブジェクト内にfunciton init（）を持っています。しかし、どうにかして子要素を追加することはできません。

init: function(){ 
      var feed = new google.feeds.Feed(FeedManager.config.feedUrl); 
       ...... 
       ...... 
       // this is not working 
       FeedManager.config.$feedContainer.append(li); 

しかし、init（）関数の内部では、再びfeedContainer要素が取得され、動作します。

var feedContainer = $('#feedContainer'); 
feedContainer.append(li); 

何が問題になりますか？どのように私の設定オブジェクトでinitialziedキャッシュされたDOM要素を使用することができます。

Answer 1

の内側にあなたは$('#feedContainer')がすでにロードされていることを確認する必要があると思います。

類似例：

<script type="text/javascript"> 
$(function() { 
var Manager = { 
    config: { 
     $p: $("p#hello") 
    }, 
    init: function() { 
     var label = Manager.config.$p.html(); 
     console.log(label); 
    } 
}; 
Manager.init(); 
}); 
</script> 

Answer 2

#feedContainer要素がHTMLに存在するのですか、それとも後でフェッチされますか？あなたが要素をキャッシュすることはできませんより後にフェッチされている場合は、 feedContainerのような単なるセレクタ文字列を使用する必要があると思います：あなたのFeedManagerオブジェクトに

を「＃のfeedContainer'`、その後

$(FeedManager.config.feedContainer).append(li); 

ようなものを使用します

HTMLに存在する場合は、DOMの準備が整った後にFeedManagerオブジェクトを定義する必要があります。

$(document).ready(function() { 
    // ... 
}); 

または$(function() { ... });