I see this in someone's code: this.$('.selector') and am curious what that does. "this" is a Backbone view. So what does prefixing "this." onto a jQuery selector, in the given context, do?

I see this in someone's code: this.$('.selector') and am curious what that does. "this" is a Backbone view. So what does prefixing "this." onto a jQuery selector, in the given context, do?

• javascript
• jquery
• backbone.js
• scope

Share Improve this question Follow edited Sep 28, 2012 at 16:24 j08691 208k3232 gold badges269269 silver badges280280 bronze badges asked Sep 28, 2012 at 16:22 Chad JohnsonChad Johnson 21.9k3636 gold badges116116 silver badges218218 bronze badges 1

• 1 It's a shortcut for $(this.el).find(...) or $('.selector',this.el) - to scope the queries w.r.t. to the el element – PhD Commented Sep 30, 2012 at 0:00

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 9

From the doc:

$ (jQuery or Zepto)view.$(selector)

If jQuery or Zepto is included on the page, each view has a $ function that runs queries scoped within the view's element. If you use this scoped jQuery function, you don't have to use model ids as part of your query to pull out specific elements in a list, and can rely much more on HTML class attributes. It's equivalent to running: view.$el.find(selector)

ui.Chapter = Backbone.View.extend({
  serialize : function() {
    return {
      title: this.$(".title").text(),
      start: this.$(".start-page").text(),
      end:   this.$(".end-page").text()
    };
  }
});

In short, it's used to access some elements of View with a familiar syntax.

It is basically limiting the search for elements with a class of selector to the element your View is based off of.

It's basically changing the scope of the search from document to this, which is obviously some element.