Backbone(2) 뷰

var UserView = Backbone.View.extend({
   initialize: function{/*.......*/},
   render: function{/*.......*/}
});

// DOM this.el
//el tageName,className,id 。
// ，el div
var UserView = Backbone.View.extend({
    tagName: "span",
    className: "users"
});

assertEqual((new UserView).el.className,"users");

// el, 
var UserView = Backbone.View.extend({
    el: $(".users")
});

// el, tageName，className,id 
var userView = new UserView({id: "followers"});

var TodoView = Backbone.View.extend({
    template: _.template($("#todo-template").html()),

    render: function(){
        $(this.el).html(this.template(this.model.toJSON()));
        return this;
    }
})
 
_.template("http://documentcloud.github.com/underscore/#template") 

var TodoView = Backbone.View.extend({
  events: {
      "change input[type=checkbox]" : "toggleDone",
      "click .destroy" : "clear",
  },

  toggleDone: function(e){/* ... */},
  clear: function(e){/* ... */}
});

//events {"eventType selector": "callback"},selector ， ， el 

// ， change ， render 
var TodoView=Backbone.View.extend({
   initialize: function(){
      _.bindAll(this, 'render' ,'close'); //_.bindAll (http://documentcloud.github.com/undersocre/#bindAll)
      this.model.bind('change' , this.render);
   },

   close: function(){/* ... */}
});

//_.bindAll  render() close() TodoView 

// ， el。 delete 
var TodoView = Backbone.View.extend({
    initialize: function(){
       _.bindAll(this, 'render', 'remove');
       this.model.bind('change', 'this.render');
       this.model.bind('delete', 'this.remove');
    },

    remove: function(){
        $(this.el).remove();
    }
});