What is the difference between $el and el in Backbone.js views?

javascript backbone.js backbone-views
ali asad picture ali asad · May 20, 2013 · Viewed 32.2k times · Source

Can you please tell the difference between $el and el in Backbone.js views?

Answer

Rayweb_on picture Rayweb_on · May 20, 2013

lets say that you do this

var myel = this.el; // here what you have is the html element, 
                    //you will be able to access(read/modify) the html 
                    //properties of this element,

with this

var my$el = this.$el; // you will have the element but 
                      //with all of the functions that jQuery provides like,
                      //hide,show  etc, its the equivalent of $('#myel').show();
                      //$('#myel').hide(); so this.$el keeps a reference to your 
                      //element so you don't need to traverse the DOM to find the
                      // element every time you use it. with the performance benefits 
                      //that this implies.

one is the html element and the other is the jQuery object of the element.

Related questions

Backbone.View "el" confusion

How should a view's el be handled? It has to be set, otherwise events don't fire (see here). But should it be an element that is already on the page? In my app, I render a (jQuery Templates) template into …

Read More
attaching backbone.js views to existing elements vs. inserting el into the DOM

I am implementing my first actual non-tutorial Backbone app, and have 2-ish questions about an aspect of using using backbone.js that isn't settling very well with me, which relates to injecting a view's rendered el into the DOM vs. …

Read More
Button Onclick event and backbone.js view

I current have an html file with the following: <div class="button1"> <button class="first" id="up" onclick="tranistionUp"> Go Up </button> <button class="last" id="down" onclick="tranistionDown"> Go Down </…

Read More