问如何将现有dom元素绑定到主干集合视图

EN

var CommentsView = Backbone.View.extend({
  tagName : 'ul',
  comments : {},
  initialize : function () {
    this.listenTo(this.collection, 'add', this.addComment);
    this.listenTo(this.collection, 'remove', this.removeComment);
    this.listenTo(this.collection, 'change', this.updateComment);
  },
  addComment : function (model) {
    this.comments[model.id] = new CommentView({model:model});
    this.$el.append(this.comments[model.id].render().$el);
  },
  removeComment : function (model) {
    this.comments[model.id].remove();
    this.comments[model.id] = null;
  },
  updateComment : function (model) {
    this.comments[model.id] = new CommentView({model:model});
    this.$('[data-id="' + model.id + '"]').before(this.comments[model.id].render().$el).remove();
  }
});

var CommentView = Backbone.View.extend({
  tagName : 'li',
  template : _.template('<div data-id="<%= id %>"><%= name %>: <%- message %></div>'),
  render : function () {
    this.$el.html(this.template(this.model.toJSON()));
    return this;
  }
});

// comments
var initialComments = [{id:1, name:'user1', message:'great!'}, {id:2, name:'user2', message:':)'}];
var actualComments = [{id:1, name:'user1', message:'great! [edited]'}];

var comments = new Backbone.Collection();
var commentsView = new CommentsView({collection:comments});

// show comments
commentsView.render().$el.appendTo('body');

// simulate fetch
comments.add(initialComments);

// simulate update
_.delay(function() {
  comments.update(actualComments);
},
2000);