design patterns - Backbone.js DOM elements references approach -


i'm building large backbone app, , here question. how cope dom elements refernces best way? find elements accessed in future (forms , things that) in view's initialize function, , bind them view itself. way don't have search these elements every time need interact them. number of references growing quite actually. approach or can better? in advance :)

code example:

initialize: function () {     this.form1 = this.$el.find('.whatever');     ...     ... } 

after applying $use method .selector cached.

html:

<div data-container>     <div data-something>smthng</div> </div> 

js:

var view = backbone.view.extend({     el : '[data-container]',     ui : {         : '[data-something]'     },     somefn : function () {         this.$use(this.ui.something).css('background', '#999');         return this;     },     $use : function (selector) {         console.log(typeof this.ui[selector] === 'undefined' ? 'dom query' : 'already cached');         var $selector = this.ui[selector] === selector ?             this.ui[selector] :             this.$(selector);          return this.ui[selector] = $selector;     } });  new view().somefn().somefn().somefn(); 

demo: http://jsfiddle.net/vpetrychuk/k7nmr/


Comments

Popular posts from this blog

c# - Operator '==' incompatible with operand types 'Guid' and 'Guid' using DynamicExpression.ParseLambda<T, bool> -