BackboneJs: En una vista cuál es la diferencia entre el: y tagName:

Question

Estoy tratando de entender este concepto.

¿Puede simplificar esto para mí y tal vez proporcionar un ejemplo simple de la diferencia entre el atributo el: y el atributo tagName:?

En algunos ejemplos, diferentes vistas usan el: a veces y otras usan tagName:.

estoy metiendo específicamente con mi propia implementación de este example

Answer 1

La diferencia es la siguiente:

EL debe utilizarse para preservar una referencia al nodo DOM real que representa la vista en su conjunto.

Esto significa que puede realizar fácilmente acciones en él con jQuery o w/e. $ (this.el) .hide() o $ (this.el) .html ('Ahora soy un Objeto de Jquery');

TagName es solo una cadena que se usa para determinar el tipo de nodo DOM que el el será. El valor predeterminado es div, pero si lo desea, puede convertirlo en cualquier elemento HTML que desee.

considerar:

var view = Backbone.View.extend({ 
    tagName: 'p', 
    initialize: function() { 
     _.bindAll(this, 'render'); 
    }, 
    render: function() { 
     $(this.el).html('I am a jQuery-ized paragraph'); 
     return this; 
    } 
}); 


$(document.body).append(new view().render().el); 

El problema que pueda estar ejecutando en es que a veces se establece el de la creación de instancias de una vista, en cuyo caso el tagName es irrelevante:

var myView = new view({ el: $("someExistingEl") }); 

Answer 2

var View = Backbone.View.extend({ 
    tagName: 'span', 
    id: 'identity', 
    class: 'classy', 
    el: $(this.tagName), // or 
    el: $('<' + this.tagName + ' />', { 
    id: this.id,  // identity 
    'class': this.class // classy 
    }) // this is jQuery shorthand for building an element fyi 
}); 

var view = new View(); 

Creo que debería funcionar bien.