What does $ ($ (this)) mean?

Question

I saw some code on the internet that uses the following statement

if ($($(this)).hasClass("footer_default")) { $('#abc') .appendTo($(this)) .toolbar({position: "fixed"}); } 

What is the use of $($(this)) and why is it needed here?

Answer 1

Yes, $($(this)) same as $(this) , the jQuery() or $() function is wonderful idempotent . There is no reason for this particular design (this double packaging), however I use as a shortcut to capture the first element only from a group that includes a similar double packaging,

$($('selector')[0])

What is the sum, grab each element that matches the selector , (which returns the jQuery object), then use [0] to grab the first in the list (which returns the DOM object), then wrap it in $() again to return it back to jQuery object, which this time contains only one element instead of a collection. This is roughly equivalent

document.querySelectorAll('selector')[0]; , which is pretty much document.querySelector('selector');

Answer 2

You can wrap $ as many times as you want, it will not change anything.

If foo is a DOM element, $(foo) will return the corresponding jQuery object.

If foo is a jQuery object, $(foo) returns the same object.

This is why $($(this)) will return just like $(this) .

Answer 3

There is no need for a double wrapper, and $($(this)) exactly the same as $(this) .

However, I once found this double wrapping in one file in my project, done by another developer. Tracking changes through the revision, it turned out that it started as $($(this).find('selector').first()) - that is, the result of some selector was wrapped to create a new object. Then, for some reason, the selector was removed and only the double packaging of this remained. Needless to say, on the next commit it was changed to $(this) .

Answer 4

As explained above, $($(this)) and $(this) absolutely identical. jQuery returns the same jQuery if you try to wrap it more than once.

Also, for performance reasons, it is recommended that you reuse jQuery objects — it is quite expensive to create jQuery objects, especially those that have complex selectors. Example:

 var $this = $(this); if ($this.hasClass("footer_default")) { $('#abc') .appendTo($this) .toolbar({position: "fixed"}); } 

Just go to Google for “jQuery best practices” - it will take you 30 minutes to learn these basics and you'll use jQuery more effectively.

Answer 5

There is no way to do this.

The following code returns the same:

 console.log($($(this)).hasClass("footer_default")) console.log($(this).hasClass("footer_default")) 

boolean depending on if the selected element has or not footer_default class:

.hasClass (class name) Returns: Boolean

Demo: http://jsfiddle.net/IrvinDominin/aSzFn/

Answer 6

$(this) and $($(this)) return a jquery object.

There is no difference between the two.