<!DOCTYPE html>

 <html>

 <head>

   <meta charset="UTF-8">

   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

   <title>Hello World in Backbone.js</title>

 </head>

 <body>

   <!-- ========= -->

   <!-- Your HTML -->

   <!-- ========= -->

   <div id="container">Loading...</div>

   <!-- ========= -->

   <!-- Libraries -->

   <!-- ========= -->

   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

   <script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js" type="text/javascript"></script>

   <script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min.js" type="text/javascript"></script>

   <script src="http://cdnjs.cloudflare.com/ajax/libs/backbone-localstorage.js/1.0/backbone.localStorage-min.js" type="text/javascript"></script>  

   <!-- =============== -->

   <!-- Javascript code -->

   <!-- =============== -->

   <script type="text/javascript">

     var AppView = Backbone.View.extend({

       // el - stands for element. Every view has a element associate in with HTML content will be rendered.

       el: '#container',

       // It's the first function called when this view it's instantiated.

       initialize: function(){

         this.render();

       },

       // $el - it's a cached jQuery object (el), in which you can use jQuery functions to push content. Like the Hello World in this case.

       render: function(){

         this.$el.html("Hello World");

       }

     });

     var appView = new AppView();

   </script>

 </body>

 </html>

Backbone hello world的更多相关文章

  1. Backbone源码解析（六）：观察者模式应用

    卤煮在大概一年前写过backbone的源码分析,里面讲的是对一些backbone框架的方法的讲解.这几天重新看了几遍backbone的源码,才发现之前对于它的理解不够深入,只关注了它的一些部分的细节和 ...

  2. MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

    注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...

  3. 使用backbone的history管理SPA应用的url

    本文介绍如何使用backbone的history模块实现SPA应用里面的URL管理.SPA应用的核心在于使用无刷新的方式更改url,从而引发页面内容的改变.从实现上来看,url的管理和页面内容的管理是 ...

  4. Backbone中的model和collection在做save或者create操作时， 如何选择用POST还是PUT方法 ？

    Model和Collection和后台的WEB server进行数据同步非常方便, 都只需要在实行里面添加一url就可以了,backbone会在model进行save或者collection进行cre ...

  5. Backbone.js 中的Model被Destroy后，不能触发success的一个原因

    下面这段代码中, 当调用destroy时,backbone会通过model中的url,向服务端发起一个HTTP DELETE请求, 以删除后台数据库中的user数据. 成功后,会回调触发绑定到dest ...

  6. Backbone.js应用基础

    前言: Backbone.js是一款JavaScript MVC应用框架,强制依赖于一个实用型js库underscore.js,非强制依赖于jquery:其主要组件有模型,视图,集合,路由:与后台的交 ...

  7. Backbone事件模块及其用法

    事件模块Backbone.Events在Backbone中占有十分重要的位置,其他模块Model,Collection,View所有事件模块都依赖它.通过继承Events的方法来实现事件的管理,可以说 ...

  8. Backbone源码学习之extend

    extend函数在backbone大概就20来行代码包括注释,对学习Javascript中"类"的继承很是好的学习资料. 下面先贴出Backbone中的源码,其中涉及到unders ...

  9. Backbone,Marionette,Talent学习笔记

    具体以源码为准 Talent继承自Marionette继承自BackBone Region: 继承自Backbone.Event,show(view)会调用view.render(),然后$el.ap ...

  10. backbone入门示例

    最近因为有个项目需要用backbone+mui  所以最近入坑backbone. Backbonejs有几个重要的概念,先介绍一下:Model,Collection,View,Router.其中Mod ...

随机推荐

  1. 微信h5支付源码DEMO参考

    类库代码 wechatH5Pay.php <?php //use Flight; /** * 微信支付服务器端下单 * 微信APP支付文档地址: https://pay.weixin.qq.co ...

  2. java判断给定路径或URL下的文件或文件夹是否存在？

    if (file.exists()) { 来判断这是不是一个文件. file.isDirectory() 来判断这是不是一个文件夹. 1.File testFile = new File(testFi ...

  3. 【noip模拟赛7】上网 线性dp

    描述 假设有n个人要上网,却只有1台电脑可以上网.上网的时间是从1 szw 至 T szw ,szw是sxc,zsx,wl自创的时间单位,至于 szw怎么换算成s,min或h,没有人清楚.依次给出每个 ...

  4. Map的知识点梳理（不包含collections工具类）

    一:基础公共方法(map不再是简单的加索引,可以直接命名key,通过key进行遍历) 1.常见的map子类 HashTable:底层是哈希表结构.不允许null键和null值,线程同步 HashMap ...

  5. Cpu 主频与睿频

    主频就是一颗CPU的运行频率.比如一颗CPU是2.3G,无论是单核还是多核,所有的核心都是工作在2.3G. 睿频是Intel的一项加速技术,指当启动一个运行程序后,处理器会自动加速到合适的频率,而原来 ...

  6. 洛谷 P1057 传球游戏 【dp】（经典）

    题目链接:https://www.luogu.org/problemnew/show/P1057 题目描述 上体育课的时候,小蛮的老师经常带着同学们一起做游戏.这次,老师带着同学们一起做传球游戏. 游 ...

  7. kali上部署dvwa漏洞测试平台

    kali上部署dvwa漏洞测试平台 一.获取dvwa安装包并解压 二.赋予dvwa文件夹相应权限 三.配置Mysql数据库 四.启动apache2和mysql服务 五.在网页配置dvwa 六.登陆到D ...

  8. 汇合confluence

    Confluence是一个专业的企业知识管理与协同软件,也可以用于构建企业wiki.使用简单,但它强大的编辑和站点管理特征能够帮助团队成员之间共享信息.文档协作.集体讨论,信息推送. 空间 空间是页面 ...

  9. 洛谷.2754.星际转移问题(最大流Dinic 分层)

    题目链接 枚举时间 每一个时间点 对于每个之前的位置像当前位置连边,表示这一时刻可待在原地 每艘船 之前时刻位置向当前时刻连边 注意别漏了0时刻src连向earth的边 #include<cst ...

  10. swoole深入学习 1. swoole初始

    0. 前言 swoole在PHP圈火了这么久,从2年前我用node写socket聊天服务器的时候就火了,那时候,经常有类似的文章php+swoole完爆nodejs之类的文章来吸引眼球,先不说它的好与 ...