Question

我似乎对下面的代码有疑问。我的html中有一个id ='content'的div元素。我想用div元素替换el属性的'body'元素但是当我键入el：$（'div'）或el：$（'div #content'）或el：$时，我的hello world文本不会'＃内容'）。我是backbone.js的初学者，在我的理解中，我相信这个el属性包含我们的父标记，其中所有模板都将作为子元素添加（在这种情况下，'body'标记为parent和'p'标记为子）。

(function($){
    var ListView = Backbone.View.extend({
    el: $('body'),      

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

    render: function(){
        (this.el).append("<p>Hello World</p>");
    }
});

var listView = new ListView();
})(jQuery);

Answer 1

View.el属性应定义为jQuery选择器（字符串），而不是对HTML元素的引用。

来自Backbone documentation：

var BodyView = Backbone.View.extend({
  el: 'body'
});

或者如您所愿，

el:'div#content'

当视图初始化时，Backbone通过view.$el属性引用该元素使其可用，该属性是一个缓存的jQuery对象。

this.$el.append("<p>Hello World</p>");

您发布的示例代码有效，因为始终只有一个body元素，并且在呈现视图时该元素已存在于DOM中。因此，当您声明el:$('body')时，您将获得对body元素的引用。 render中的代码有效，因为this.el现在是对jQuery对象的直接引用：

(this.el).append("<p>Hello World</p>");

如果您需要使用现有DOM元素（而不是选择器）初始化Backbone视图，Backbone文档建议将其传递到initialize函数中。

无法将html元素附加到骨干中的el。

1 个答案: