1.  <!DOCTYPE html>
  2.  <html>
  3.  <head>
  4.    <meta charset="UTF-8">
  5.    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  6.    <title>Hello World in Backbone.js</title>
  7.  </head>
  8.  <body>
  9.    <!-- ========= -->
  10.    <!-- Your HTML -->
  11.    <!-- ========= -->
  12.  
  13.    <div id="container">Loading...</div>
  14.  
  15.    <!-- ========= -->
  16.    <!-- Libraries -->
  17.    <!-- ========= -->
  18.    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
  19.    <script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js" type="text/javascript"></script>
  20.    <script src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min.js" type="text/javascript"></script>
  21.    <script src="http://cdnjs.cloudflare.com/ajax/libs/backbone-localstorage.js/1.0/backbone.localStorage-min.js" type="text/javascript"></script>  
  22.  
  23.    <!-- =============== -->
  24.    <!-- Javascript code -->
  25.    <!-- =============== -->
  26.    <script type="text/javascript">
  27.      var AppView = Backbone.View.extend({
  28.        // el - stands for element. Every view has a element associate in with HTML content will be rendered.
  29.        el: '#container',
  30.        // It's the first function called when this view it's instantiated.
  31.        initialize: function(){
  32.          this.render();
  33.        },
  34.        // $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.
  35.        render: function(){
  36.          this.$el.html("Hello World");
  37.        }
  38.      });
  39.  
  40.      var appView = new AppView();
  41.    </script>
  42.  
  43.  </body>
  44.  </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. python全栈开发day21-2 几个装饰器总结

    1 @property 将一个方法伪装成属性 2.@propertty @f.setter 设置伪装成方法的属性 3.@propertty @f.deleter 删除一个伪装成方法的属性. class ...

  2. asp.net core服务的生命周期

    Transient:每一次GetService都会创建一个新的实例 Scoped:在同一个Scope内只初始化一个实例 ,可以理解为( 每一个request级别只创建一个实例,同一个http requ ...

  3. 安装oracle11g时遇到INS-13001环境不满足最低要求

    在安装oracle11g,点击setup.exe之后,弹出了如下提示框: 解决方法: 首先,打开你解压后的database文件夹,找到stage,然后cvu,找到cvu_prereq.xml文件,用记 ...

  4. 打印不同对象的字节表示 ( 对int*强制转换成unsigned char*的理解 )

    此文章参考<深入理解计算机系统>P31. 先看如下代码:  12345的十六进制表示为:0x00003039 #include <stdio.h> int main() { ; ...

  5. poj 1160 Post Office 【区间dp】

    <题目链接> 转载于:>>> 题目大意: 一条高速公路,有N个村庄,每个村庄均有一个唯一的坐标,选择P个村庄建邮局,问怎么选择,才能使每个村庄到其最近邮局的距离和最小?最 ...

  6. SpringMVC框架09——@ResponseBody的用法详解

    @ResponseBody可以标注在方法上也可以标注在类上面.简单来说,当标注在方法上时,该方法的返回结果直接转成JSON格式:当标注在类上时,该类中的所有方法的返回结果都转换成JSON格式. 代码示 ...

  7. C# 开发圆角控件的具体实现

    http://www.jb51.net/article/47433.htm 代码来源

  8. loj#6076「2017 山东一轮集训 Day6」三元组 莫比乌斯反演 + 三元环计数

    题目大意: 给定\(a, b, c\),求\(\sum \limits_{i = 1}^a \sum \limits_{j = 1}^b \sum \limits_{k = 1}^c [(i, j) ...

  9. Ubuntu Siege 压力测试工具

    安装 $ sudo apt install siege Siege命令常用参数 -c 200 指定并发数200 -r 5 指定测试的次数5 -f urls.txt 制定url的文件 -i intern ...

  10. Python不定参数函数

    1. 元组形式 def test1(*args): print('################test1################') print(type(args)) print(arg ...