|
| 1 | +jQuery-Plus |
| 2 | +-- |
| 3 | + |
| 4 | + - You can now request an elements entire data object by passing no arguments to `data()`: |
| 5 | + |
| 6 | + $(element).data(); // => {/* data object */} |
| 7 | + |
| 8 | + - The `bind` method accepts multiple events handlers by passing an object with each property as a handler: |
| 9 | + |
| 10 | + $(element).bind({ |
| 11 | + click: function(){}, |
| 12 | + mouseover: function(){}, |
| 13 | + mouseout: function(){} |
| 14 | + }); |
| 15 | + |
| 16 | + - The `bind` method also accepts an non-function event handler in the form of an actionable-object: |
| 17 | + |
| 18 | + $(element).bind('click', { toggleClass: 'something' }); |
| 19 | + // This applies to one(), click(), mouseover() etc. etc. |
| 20 | + |
| 21 | + - There's a helpful log function under jQuery's namespace: |
| 22 | + |
| 23 | + $(element).log(); |
| 24 | + $.log('something'); |
| 25 | + |
| 26 | + - Every initial selection you make is assigned to jQuery._this: |
| 27 | + |
| 28 | + $(element).width( $._this.parent().innerWidth() ); |
| 29 | + |
| 30 | + - The `end` method now accepts a numerical argument signifying how far back you want to go: |
| 31 | + |
| 32 | + $(element).find('a').find('span').end(2); // (goes back to $(element)) |
| 33 | + |
| 34 | + - The `filter` method now accepts a matching criteria in the form of an object: |
| 35 | + |
| 36 | + $(lotsOfElements).filter({ |
| 37 | + id: /^(apple|banana|mango)$/, |
| 38 | + src: /\.(png|jpg)$/, |
| 39 | + rel: 'something' |
| 40 | + }); |
| 41 | + |
| 42 | + - The `map` method accepts a string signifying what attributes to map: |
| 43 | + |
| 44 | + $(lotsOfElements).map('attr:href'); // => ['http://google.com', 'http://msn.com', ...] |
| 45 | + |
| 46 | + - All setter methods accept functions; these function must returnt he intended value: |
| 47 | + |
| 48 | + $(element).css(function(){ |
| 49 | + return { |
| 50 | + color: $(this).css('backgroundColor') |
| 51 | + } |
| 52 | + }); |
| 53 | + |
| 54 | + - All getter methods can return a full array of results instead of a single one; to enable this you must pass true as the very first argument: |
| 55 | + |
| 56 | + $(lotsOfElements).width(); // 120 |
| 57 | + $(lotsOfElements).width(true); // [120, 230, 125, ...] |
| 58 | + |
| 59 | + - You can query data in selectors by using the `:data` selector. Passing no arguments tests if that elements has any data. |
| 60 | + |
| 61 | + $('div:data'); // => All DIVs with data |
| 62 | + $('div:data(abc)'); // => Tests that "abc" property is a truthy value |
| 63 | + $('div:data(abc=123)'); // => Tests that "abc" prop is equal to "123" |
| 64 | + $('div:data(abc=/\\d/)'); // => Tests that "abc" prop has at least one digit |
| 65 | + |
| 66 | + - `%=` operator can be used in attribute selectors for testing against a regular expression: |
| 67 | + |
| 68 | + $('a[href%=/^https?:/i]'); |
0 commit comments