jQuery version in jQuery.fn.jquery

Get the version of jQuery

jQuery.fn.jquery
// >> '1.6.1'

It’s bizarre that you can get this via a jQuery method. It allows you to get it as a property on any jQuery object.

$(document).jquery
// >> '1.6.1'

jQuery.data

I’ve been familiar with jQuery’s data method for a while now. It’s awesome, allowing you to get and set data with a jQuery object.

$('body').data('foo', 52);
$('body').data('bar', { myType: 'test', count: 40 });

$('body').data('foo'); // 52
$('body').data(); // {foo: 52, bar: { myType: 'test', count: 40 }}

It’s especially useful within jQuery plugins, providing a mechanism to save the plugin’s state.

While looking over jQuery UI plugin bridge, I found they were using $.data() instead of $.fn.data. Where as $.fn.data is a method for jQuery objects like $('#elem').data('foo', 52), $.data() is a utility function that uses an element as one of its arguments.

$.data( document.body, 'foo', 52);
$.data( document.body, 'bar', { myType: 'test', count: 40 });

$.data( document.body, 'foo'); // 52
$.data( document.body ); // {foo: 52, bar: { myType: 'test', count: 40 }}

Using $.data() can yield better much performance as you don’t have to wrap an element in a jQuery object. Testing on jsPerf, my results had $.data() performing 5x faster than $.fn.data(). Within Isotope, making this change is boosting performance of sorting by 2x.

Removing a jQuery object from another jQuery object

Working on Isotope, I have a scenario where I need to remove a jQuery object from another jQuery object. Item elements are cached within the plugin’s instance. If the user needs to remove those elements from the DOM, they need to also remove them from the cache.

The solution is to use the .not method.

// removes $b from $a
$a = $a.not( $b )

You need to assign the result of the statement back to the original jQuery object. Using just $a.not( $b ) will not affect $a.

See also How to remove an element from jQuery object? - Stack Overflow

Remove items from jQuery object fiddle

You can make a jQuery object using standard DOM methods

$( document.getElementsByTagName('input') );

Is the same thing as

$('input');