点保存时候不注意发出来了，有需要的朋友将就看吧，还在更新......
几个月前学习了一下backbone，这段时间也用了下，感觉之前对backbone的学习很是基础，前几天有个园友问我如何将路由的#改为其他
我其实想说这个不能乱改，又怕不熟悉误人子弟，所以今天我们来一起重新学习下他，看看会不会带来不一样的感觉
我在博客园nuysoft的博客看到了backbone的分析，可惜没有写完，不失为一个遗憾，希望作者坚持下去，水平高得贡献出来哟（@nuysoft）
然后，网上backbone基础用法的学习文章很多，感觉就nuysoft的深入，只不过多是点一下有点可惜，再次希望作者坚持下去......
Web应用越来越关注前端，现在一个服务器端可能要对付五个前端，前端的业务逻辑复杂，各种问题层出不穷，现实对javascript程序的重用性、健壮性提出了更高的要求
要求提高了，但是并不会给你更多的时间，反而为了抢占移动市场份额而拉快开发速度，现在的前端不可谓不难
PS：如果你的公司是互联网公司且不重视前端的话，你可以来我们公司啊......
Backbone是一个基于MVC模式的架构，本身强依赖与underscore，所以上个星期我们初略的学习了下underscore，有了一个大概印象
非强制依赖于jquery/zepto，然后require是一个很好的基友，建议不要放过
backbone据我使用来看，有几个优点：
① 模板引擎避免js中嵌入过多html代码，这是一种结构数据分离的体现，但是他要归功于underscore了
然后他的优点我用的时候就没有了......
以上说法其实有点坑爹，我们为了减少backbone的size，所以对backbone做了删除，最后只用到了其中的view（事件处理），控制器我们自己实现了
所以，我应该还未学习到backbone的精华，好了，前面扯多了，我们正式开始学习吧，这里附上之前的学习博客：
http://www.cnblogs.com/yexiaochai/p/3219402.html
http://www.cnblogs.com/yexiaochai/p/3221081.html
例子参考：http://www.ibm.com/developerworks/cn/web/wa-backbonejs/
简单例子
我们今天首先做一个简单的例子，然后通过例子去读backbone的源码，明天再整体进行学习，这个例子当然就是我们伟大的官方例子了......
第一步，页面结构
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <title>Backbone.js Todos</title> 6 <link rel="stylesheet" href="todos.css" /> 7 </head> 8 <body> 9 <div id="todoapp"> 10 <header> 11 <h1> 12 Todos</h1> 13 <input id="new-todo" type="text" placeholder="What needs to be done?"> 14 </header> 15 <section id="main"> 16 <input id="toggle-all" type="checkbox"> 17 <label for="toggle-all"> 18 Mark all as complete</label> 19 <ul id="todo-list"> 20 </ul> 21 </section> 22 <footer> 23 <a id="clear-completed">Clear completed</a> 24 <div id="todo-count"> 25 </div> 26 </footer> 27 </div> 28 <div id="instructions"> 29 Double-click to edit a todo. 30 </div> 31 <div id="credits"> 32 Created by 33 <br /> 34 <a href="http://jgn.me/">Jérôme Gravel-Niquet</a>. 35 <br /> 36 Rewritten by: <a href="http://addyosmani.github.com/todomvc">TodoMVC</a>. 37 </div> 38 <script src="../../test/vendor/json2.js"></script> 39 <script src="../../test/vendor/jquery.js"></script> 40 <script src="../../test/vendor/underscore.js"></script> 41 <script src="../../backbone.js"></script> 42 <script src="../backbone.localStorage.js"></script> 43 <script src="todos.js"></script> 44 <!-- Templates --> 45 <script type="text/template" id="item-template"> 46 <div class="view"> 47 <input class="toggle" type="checkbox" <%= done ? 'checked="checked"' : '' %> /> 48 <label><%- title %></label> 49 <a class="destroy"></a> 50 </div> 51 <input class="edit" type="text" value="<%- title %>" /> 52 </script> 53 <script type="text/template" id="stats-template"> 54 <% if (done) { %> 55 <a id="clear-completed">Clear <%= done %> completed <%= done == 1 ? 'item' : 'items' %></a> 56 <% } %> 57 <div class="todo-count"><b><%= remaining %></b> <%= remaining == 1 ? 'item' : 'items' %> left</div> 58 </script> 59 </body> 60 </html>