Chain

Wee allows many methods to be chained to selectors by omitting the first argument of the method. This often makes code more readable and permits multiple methods to be executed on the same selection.

Animate

In this example, the target is faded out to full transparency.

$('ref:element').tween({
    opacity: 0
}, {
    duration: 600
});

Core

Reverse

The reverse method simply reverses the order of the selection results.

$('.element').reverse();

toArray

Convert a Wee selection to a simple array

$('.element').toArray();

Events

In this example, the selector is the element to which the event is bound.

$('.element').on('click', function() {
    // Click logic
});

Here the event is being triggered on the selector.

$('.element').trigger('click');

Register

To register a new chainable method follow the pattern below.

Wee.$chain('setId', function(id) {
    this.attr('id', id);

    return this;
});

Alternatively you can register methods in a jQuery-compatible syntax.

$.fn.setId = function(id) {
    this.data('id', id);

    return this;
};

To execute the method use the following.

$('.element').setId(3).show();

Be sure to return this at the end of your method if the function’s purpose is not to return another value. This ensures the chain can continue.

Shortcuts

All the core and DOM methods prefixed with $ are shortcut when chaining is enabled. Just remove the method’s dollar sign and replace Wee with $.

Examples

$.unique([1, 2, 2, 3]);
$.get('key');
$.height('ref:element');

View

The view chain method updated the content of a DOM element given a data object.

<div class="element">
    <span class="{{ className }}">{{ content }}</span>
</div>
$('.element').render({
    className: 'dynamic-class',
    content: 'Span contents'
});