1、可以无刷新改变页面内容，但无法改变页面URL(有复制链接给他人的需求等无法实现)
2、为了更好的可访问性，内容发生改变后，通常改变URL的hash(散列片段)
3、hash的方式不能很好的处理浏览器的前进、后退等问题
4、进而浏览器引入了onhashchange的接口，不支持的浏览器只能定时去判断hash是否改变
5、但这种方式对搜索引擎很不友好 我们可以发现新浪微博的部分区域是无页面刷新的，但是它的**url却可以变化**，实现了浏览器的前进后退，那是因为HTML5里引用了新的API，history.pushState和history.replaceState,他们可以操作浏览器历史，并且改变当前页面的URL.  

//示例
App.Routers.Main = Backbone.Router.extend({

   "" : "index",
   "/teams" : "getTeams",
   "/teams/:country" : "getTeamsCountry",
   "/teams/:country/:name : "getTeam"
   "*error" : "fourOfour"
   	},

   // Homepage 
   	},

   // List all teams 
   	},
   	getTeamsCountry: function(country) {
   // Get list of teams for specific country
   	},
   	getTeam: function(country, name) {
   // Get the teams for a specific country and with a specific 		name
   	},	
   	fourOfour: function(error) {
   // 404 page
   	}
});

//示例
$(function(){
	var router = new App.Routers.Main();
	Backbone.history.start({pushState : true});
})

//当实例化路由器时，会生成 Backbone.history 对象；它将自动引用 Backbone.History 函数。Backbone.History 负责匹配路由和 router 对象中定义的活动。start() 方法触发后，将创建 Backbone.history 的 fragment 属性。它包含散列片段的值。该序列在根据状态次序管理浏览器历史方面十分有用。用户如果想要返回前一状态，单击浏览器的返回按钮。

App.Models.Team = Backbone.Model.extend({
	defaults : {
   		// default attributes
}
//Domain-specific methods go here
});	

// "name" attribute is set into the model
var team1 = new App.Models.Team({
	name : "name1"
});
console.log(team1.get("name")); // prints "name1"

// "name" attribute is set with a new value
team1.set({
	name : "name2"
});
console.log(team1.get("name")); //prints "name2" ###更改 App.Models.Team 模型中的事件处理程序

App.Models.Team = Backbone.Model.extend({
	initialize : function(){
    	this.bind("change", this.changed);
	},
	changed : function(){
    	alert("changed");
	}
}); ###在模型对象上调用 save 方法   Backbone 的另一个优势是易于**通过Ajax交互与服务器进行通信**。在模型上调用一个save()方法会通过REST JSON API异步**将当前状态保存到服务器**

model.save(); ###模型对象的 Fetch() 方法   当需要从服务器检索一个模型时，请求一个Read活动并使用一个 Ajax GET 请求。这类请求使用fetch()方法。要**确定导入模型数据或者从中取出模型数据的服务器的位置**：   如果模型属于一个 collection，那么集合对象的url属性将是该位置的基础，并且该模型 ID（不是cid）会被附加以构成完整的 URL。   如果模型不是在一个集合中，那么该模型的 urlroot 属性被用作该位置的基础

var teamNew = new App.Models.Team({
	urlRoot : '/specialTeams'
});
teamNew.save(); // returns model's ID equal to '222'
teamNew.fetch(); // Ajax request to '/specialTeams/222' ###模型的验证方法validate()

App.Models.Team = Backbone.Model.extend({
validate : function(attributes){
    if (!!attributes && attributes.name === "teamX") {
        // Error message returned if the value of the "name" 
        // attribute is equal to "teamX"
        return "Error!";
    }
});

App.Views.Teams = Backbone.View.extend({
	el : 'UL.team-list'
});
// In the following view, el value is 'div.team-element'
App.Views.Team = Backbone.View.extend({
	className : '.team-element',
	tagName : 'div'
});

App.Views.Team = Backbone.View.extend({
	...
	model : new App.Models.Team
}); ### Render() 方法 重写render()方法和逻辑来显示DOM元素（由el属性引用的）中的模型属性

App.Views.Team = Backbone.View.extend({
	className : '.team-element',
    tagName : 'div',
	model : new App.Models.Team
	render : function() {
    // Render the 'name' attribute of the model associated
    // inside the DOM element referred by 'el'
    	$(this.el).html("<span>" + this.model.get("name") + "</span>");
}
}); ### 使用 _.template() 函数的视图

App.Views.Team = Backbone.View.extend({
className : '.team-element',
tagName : 'div',
model : new App.Models.Team
render : function() {
    // Compile the template
    var compiledTemplate = _.template($('#teamTemplate').html());
    // Model attributes loaded into the template. Template is
    // appended to the DOM element referred by the el attribute
    $(this.el).html(compiledTemplate(this.model.toJSON()));
}
}); ### Render() 方法绑定到模型变更事件 Backbone中**最有用且最有趣**的一个功能是将render()方法绑定到模型的变更事件中

App.Views.Team = Backbone.View.extend({
	model : new App.Models.Team,
	initialize : function() {
    	this.model.bind("change", this.render, this);
	} 
})
//当模型发生更改时，会自动触发 render() 方法，从而节省数行代码 ### _.bindAll()

App.Views.Team = Backbone.View.extend({
	initialize : function() {
   		_.bindAll(this, "render");
    	this.model.bind("change", this.render);
	} 
})

App.Views.Team = Backbone.View.extend({
	className : '.team-element',
	tagName : 'div',
	events : {
    	"click a.more" : "moreInfo"
	},
	moreInfo : function(e){
    	// Logic here
	}
})