BackboneJs: В представлении, в чем разница между el: и tagName:

Я пытаюсь обвести вокруг этой концепции.

Можете ли вы опустить это для меня и, возможно, представить простой пример разницы между атрибутом el: и атрибутом tagName:?

В некоторых примерах разные представления иногда используют el:, а другие используют tagName:.

Я специально возился с моей собственной реализацией этого

Ответ 1

Разница заключается в следующем:

el следует использовать для сохранения ссылки на фактический DOM node, представляющий представление в целом.

Это означает, что вы можете легко выполнять действия с ним с помощью jQuery или w/e. $(this.el).hide() или $(this.el).html( "Я сейчас объект JQuery" );

TagName - это только строка, которая используется для определения типа DOM node el. По умолчанию используется div, но если вы захотите, вы можете сделать его любым HTML-элементом, который вам нравится.

Рассмотрим:

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 для создания экземпляра представления, и в этом случае tagName не имеет значения:

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

Ответ 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();

Я думаю, что это должно работать нормально.