el
- 所有的view都有一个DOM元素,就是el属性
- 可以指定:tagName、className、id、attribute等
- 如何不定义的话,就是一个空的div
var ItemView = Backbone.View.extend({ tagName:'li' }); var BodyView = Backbone.View.extend({ el:'body' }); var item = new ItemView(), body = new BodyView(): console.log(item.el + body.el);
相关推荐
本篇文章重点讲解Backbone.js框架中的View视图组件。 Backbone.js的View视图是一个非常重要的部分,它用于构建用户界面。Backbone.js的View视图主要负责绑定和处理DOM事件,它还可以用来反映你应用程序中Model的...
Backbone.js的核心设计理念是MVVM(Model-View-ViewModel)架构模式,这种模式使得数据模型与用户界面之间的交互更加清晰。 **一、Backbone的主要组件** 1. **Model**:Backbone中的模型是应用的核心,负责存储和...
首先,Backbone.View的`el`属性是至关重要的。`el`代表Element,即该View所关联的DOM元素。如果在创建View时不指定`el`,Backbone会默认创建一个空的`<div>`元素。然而,通常我们会提供一个已存在的DOM元素,如`#...
var UserView = Backbone.View.extend({ el: "#user-info", initialize: function() { this.model.on("change", this.render, this); }, render: function() { var template = _.template($("#user-template")...
### Backbone.js框架中的View视图详解 ...View是Backbone的核心组成部分之一,它不仅负责渲染数据,还负责监听用户事件并做出响应。掌握View的使用方法有助于你更高效地开发出具有良好用户体验的应用程序。
define(['backbone', 'collections/collection1', 'views/view1'], function(Backbone, Collection, View) { var App = { start: function() { var collection = new Collection(); var view = new View({...
首先,View是Backbone.js的核心组件之一,它允许开发者绑定DOM元素和事件处理器,以及处理用户输入。在描述中提到,如果View的`el`属性没有定义,Backbone会默认创建一个空的`<div>`作为视图的容器。在实际应用中,...
Backbone.js是一款轻量级的JavaScript库,它引入了MVC(Model-View-Controller)设计模式,使得前端开发更加有组织和结构化。在Backbone.js中,View是负责处理DOM交互和用户事件的核心组件。以下是对Backbone.js框架...
Backbone.js 建立在 jQuery 和 Underscore.js 之上,因此它可以无缝集成到已经使用这些库的项目中。此外,它还支持通过 RESTful JSON 接口与服务器通信,使得前后端之间的数据交换更加高效。 #### 二、通过 Hello...
View是BackBone中的另一个关键组件,主要用于界面的展示。它负责将Model的数据渲染到DOM中,同时处理用户与界面的交互。View可以通过绑定事件来响应用户的操作,更新Model,进而驱动界面的变化。 例如: ```...
在示例中,通过`view.setElement(button2)`,View的`el`从`button1`变为了`button2`,并且点击事件也随之转移。 `events`属性是Backbone View中定义事件处理的哈希表,键是DOM事件(如`'click'`),值是事件处理...
backbone.radio_view 主干无线电查看助手 用法 new Backbone . RadioListView ( { el : $ ( '.input-user' ) , collection : new Backbone . Collection ( [ { id : 1 , name : 'jarvis' } , { id : 2 , ...
创建View通常是通过`Backbone.View.extend()`,并且可以设置`el`属性来指定View对应的DOM元素,或者在初始化时传入一个DOM元素。 ```javascript var MyView = Backbone.View.extend({ // 视图逻辑 }); ``` View的...
每个View实例都有一个el属性,表示View在DOM中的容器元素。 **三、Collection** Collection是Model的集合,它扩展自Backbone的Array对象,提供了一组Model的管理和操作接口。Collection内部可以维护一个Model数组,...
var ListView = Backbone.View.extend({ el: '#contact-list', initialize: function() { this.collection.on('add', this.addOne, this); }, addOne: function(contact) { var contactView = new ContactView...
在Backbone中,视图通常通过"el"属性来引用其对应的DOM元素,并可以加载模板(template)以创建动态内容。 模型(Model)代表了应用中的数据和业务逻辑。模型是与后端交互的核心,它包含数据字段和相关的业务逻辑...
Backbone视图提供了一个"el"属性,这个属性可以用来指定视图对应的DOM元素。视图可以加载模板来渲染数据,监听事件,并为开发者提供一些技巧和提示以更好地使用Backbone。 模型(model)是Backbone中的一个核心概念,...
总结来说,这个Backbone.js的Hello World实例展示了如何利用Backbone的核心组件(Model、View、Controller)与后端进行通信,以及如何使用模板引擎(Mustache)动态地展示数据。它是一个基本的单页应用(SPA)结构,...