CODEWITHSUNDEEP
jquerylistdom
Shahriar
Shahriar

Reputation: 824

How to properly cache DOM element in jquery?

I am having some trouble accessing cached DOM element from the namespace variable. My FeedManager config variable is like this:

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

Here the $feedContainer is the ul element in the html. I wanted to add li elements built from the feed. I have a funciton init() inside FeedManager object. But somehow it can not add the child element.

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

but if inside init() function,I again get the feedContainer element ,it works !

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

What can be the problem? and how can I use cached dom element initialzied in my config object.

Upvotes: 2

Views: 1613

Answers (2)

moey
moey

Reputation: 10897

You'd need to make sure the $('#feedContainer') has already been loaded.

An analogous example:

<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>

Upvotes: 1

rsp
rsp

Reputation: 111404

Is your #feedContainer element present in your HTML or is it fetched later? If it is fetched later than you can't cache the element, you'd have to use just a selector string like feedContainer: '#feedContainer'`

in your FeedManager object and then use something like

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

If it is present in HTML then make sure that you define your FeedManager object after the DOM is ready, ie. inside of a

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

or $(function () { ... });

Upvotes: 1

Related Questions