Backbone.js Tutorial - 7 - (Views) Differerence between el and $el (ok)

C:\Users\Administrator\Desktop\gulp\app.js

var theView = Backbone.View.extend({
	defaults: {
		name: 'Website'
	},
	initialize: function() {
		console.log(this.el);
		console.log(this.$el);
	}
});
jQuery(document).ready(function($) {
	var page = new theView({el: $('#div1')});
});

C:\Users\Administrator\Desktop\gulp\index.html

<!DOCTYPE html>
<html>
<head>
  <title>Backbone Example</title>
  <link rel="stylesheet" href="lib\css\todos.css" />
  <script src="lib/js/jquery-1.9.1.js"></script>
  <script src="lib/js/underscore.js"></script>
  <script src="lib/js/backbone.js"></script>
  <script src="app.js"></script>
</head>
<body>
  <div id="div1"></div>
  <div id="div2"></div>
  <div id="div3"></div>
</body>
</html>

C:\Users\Administrator\Desktop\gulp\app.js

var theView = Backbone.View.extend({
	defaults: {
		name: 'Website'
	},
	initialize: function() {
		console.log(this.el);
		console.log(this.$el);
		this.$el.append('Lorem ipsum dolor sit amet.');
	}
});
jQuery(document).ready(function($) {
	var page = new theView({el: $('#div1')});
});

PreviousBackbone.js Tutorial - 6 - Introduction to Views (ok)NextBackbone.js Tutorial - 8 - (Views) Creating New HTML Elements (ok)

Last updated

Was this helpful?