javascript - Backbone this.el 与 this.$el

Question

对于给定的示例，this.el 和 this.$el 之间有什么区别？

我知道 this.$el 指向 this.el 的 jQuery 对象，在本例中是 'li'。

当我呈现 View 时，我可以在 this.el 或 this.$el 之间进行选择。当我引用 jQuery 对象时，我如何能够将某些内容呈现到页面上？我可以看到如何使用 this.$el.html(property) 指向 html，但为什么附加 this.$el 并让它呈现让我感到困惑。

var Person = Backbone.Model.extend({
    defaults: {
        name: 'John Doe',
        age: 30,
        occupation: 'worker'
    }
});

var PersonView = Backbone.View.extend({
    tagName: 'li',

    initialize: function() {
        this.render();
    },

    render: function() {
        var out = this.$el.html(this.model.get('name') + this.model.get('occupation'));
        console.log(this, this.el, this.$el, out);
        $('body').append(this.$el);
    },

});

var person = new Person;
var personview = new PersonView({model: person});

Answer 1

Bojangles 是正确的。

this.$el 是对 jQuery 上下文中元素的引用，通常与 .html() 或 .addClass( ) 等。例如，如果您有一个 ID 为 someDiv 的 div，并将其设置为 Backbone View 的 el 属性，则以下语句是相同的:

this.$el.html()$("#someDiv").html()$(this.el).html()

this.el 是 native DOM 元素，未受 jQuery 影响。