脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-Backbone.js学习笔记，你值得拥有，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。 backbone.js提供了一套web开发的框架，通过Models进行key-value绑定及custom事件处理,通过Collections提供一套丰富的API用于枚举功能,通过Views来进行事件处理及与现有的Application通过RESTful JSON接口进行交互.它是基于jquery和underscore的一个js框架。
主要组成：
1.model：创建数据，进行数据验证，销毁或者保存到服务器上
2.collection：可以增加元素，删除元素，获取长度，排序，比较等一系列工具方法，说白了就是一个保存 models的集合类
3.view：绑定htML模板，绑定界面元素的事件，初始的渲染，模型值改变后的重新渲染和界面元素的销毁等
优势：
1. 将数据和界面很好的分离开来。
2. 将事件的绑定很好的剥离出来，便于管理和迭代。
3. 使得Javascript程序的模块化更加清晰、明了。
应用场景：
最适合的应用场景是单页面应用，并且页面上有大量数据模型，模型之间需要进行复杂的信息沟通。
简单的一个Hello World实例
复制代码
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <tITle>Hello World</title>
5 </head>
6 <body>
7 <button id="BTncheck">测试一下</button>
8 <ul id="world-list">
9 </ul>
10 </body>
11 <script src="https://ajax.GOOGLEapis.COM/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
12 <script src="https://ajax.cdnjs.com/ajax/libs/underscore.js/1.1.4/underscore-min.js"></script>
13 <script src="https://ajax.cdnjs.com/ajax/libs/backbone.js/0.3.3/backbone-min.js"></script>
14
15 <script>
16 (function ($) {
17 VAR World = Backbone.Model.extend({
18 //创建一个World的对象，拥有name属性
19 name: null
20 });
21
22 var Worlds = Backbone.Collection.extend({
23 //World对象的集合
24 model:World
25 });
26
27 var objWorlds = new Worlds();//初始化一个collection对象
28 objWorlds.bind("add", function(World) {//注册监听事件
29 $("#world-list").append("<li>用户 <b>" + World.get('name') + "</b> 对你说：hello world！</li>");
30 });
31
32 var WorldView = Backbone.View.extend({
33 el: $("body"),
34 events: {
35 "click #btncheck": "checkIn", //事件绑定，绑定Dom中id为check的元素
36 },
37 checkIn: function () {
38 var world_name = prompt("你叫什名字?");
39 if(world_name == "") world_name = 'None';
40 var world = new World({ name: world_name });
41 objWorlds.add(world);
42 }
43 });
44 //实例化Appview
45 var objWorldView = new WorldView();
46 })(jQuery);
47 </script>
48 </html>
觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ js脚本，巧夺天工，精雕玉琢。小宝典献丑了！
以上是脚本宝典为你收集整理的javascript代码实例教程-Backbone.js学习笔记，你值得拥有全部内容，希望文章能够帮你解决javascript代码实例教程-Backbone.js学习笔记，你值得拥有所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。