JavaScript | Miq | Documentation | License

Miq Documentation

Documentation

$
$() Returns an empty documentFragment, a lightweight container for DOM elements. See below.
$(function) Runs function when the DOM content is loaded.
$(Element) Creates a collection containing one DOM element.
$(NodeList) Creates a collection containing the DOM elements.
$("<element>") Creates a collection containing one created DOM element.
$("<element>", context) Creates a collection containing one created DOM element within context.
$(cssSelector) Creates a collection containing the DOM elements matching the selector.
$(cssSelector, context) Creates a collection containing the DOM elements matching the selector within context.

.addClass
Collection.addClass(className) Adds a class to all elements in the collection.

.append
Collection.append(Collection2) Adds a collection(2) to the collection.

.attr
Collection.attr(attribute) Returns the attribute of the first element in the collection.
Collection.attr(attribute, value) Set the attribute to value for all elements in the collection.

.before
Collection.before(element) Inserts element before the first element in the collection.

.clone
Collection.clone() Returns a clone of the first element in the collection.

.closest
Collection.closest(cssSelector) Returns the first parent of the first element in the collection matching the cssSelector.

.css
Collection.css(property) Returns the css property of the first element in the collection.
Collection.css(property, value) Set the css property to value for all elements in the collection.

.eq
Collection.eq() Returns the first element as a new collection.
Collection.eq(index) Returns the element on position index as a new collection.

.find
Collection.find(cssSelector) Returns all children matching cssSelector.

.first
Collection.first Returns first Element from the collection.

.hasClass
Collection.hasClass(className) Returns whether the first element of the collection has class className.

.html
Collection.html() Returns the HTML code of the first element of the collection.
Collection.html(htmlString) Sets the HTML of all elements in the collection the htmlString.

.is
Collection.is(cssSelector) Returns all elements in the collection matching cssSelector.

.off
Collection.off(event, function) Turns off the event listener function for event.

.on
Collection.on(event, function) Turns on the event listener function for event.

.parent
Collection.parent() Returns the first parent of the first element of the collection.

.prop
Collection.prop(property) Returns the proprty of the first element in the collection.
Collection.prop(property, value) Sets the property of all elements in the collection to value.

.remove
Collection.remove() Removes all elements in the collection from the DOM.

.removeAttr
Collection.removeAttr(attribute) Removes attribute from all elements in the collection.

.removeClass
Collection.removeClass(className) Removes class className from all elements in the collection.

.text
Collection.text() Returns the inner text of the first element of the collection.
Collection.text(textString) Sets the inner text of all elements in the collection the htmlString.

.val
Collection.val() Returns the value of the form element that is first in the collection.
Collection.val(value) Sets the value of the form element that is first in the collection.

$.ajax
$.ajax(url, options) Performs an Ajax request to url with options.
Options:
method: the method to use, defaults to ‘GET’.
dataType: “xml”, “json” or “text” (default).
headers: headers to send in the request.
Returns: promise with the returned data or error code when failed. See below for an example.

$.ajaxCallback
$.ajaxCallback(url, resolve, reject, options) See $.ajax(). Instead of returning a promise, one of the functions resolve or reject is called.

$.miq
$.miq Returns semantic version string of miq.

In addition to the functions above, miq inherits all functionality of Array. Some interesting functionality is:

.length
Collection.length Returns the number of elements in the collection.

.filter
$(Collection.filter(function)) Retuns a new collection with only the elements filtered by function

.map
Collection.map(function) Performs a function on all elements in the collection and returns the result.

.concat
$(Collection.concat(collection2)) Retuns collection combined with collection2.

See MDN Array reference for all Array properties and functions.

Differences from jQuery

Although the functions in miq are very similar to the ones in jQuery, miq adds a couple of improvements.

Array functions

As can be seen in de documentation above, miq inherits all the functionality of Array. Be aware the Array functions do not return miq collections. Run $(result) to get a miq collection.

Example:

var mailLinks = $( $('a').filter(function(el) {
    return $(el).attr('href').substr(0, 7) == 'mailto:';
}));

documentFragment

$() will return an empty documentFragment. A documentFragment is a lightweight container of DOM nodes. See also documentFragment on MDN.

Example:

var fragment = $();
fragment.append($("<li>").text("nose"));
fragment.append($("<li>").text("ear"));
$("<li>").append(fragment);

Ajax

Using Ajax with promises has several advantages than using call backs. Modern browsers already support promises. If you need to support older browsers without promises, you can use a polyfill like native-promise-only.

var promise = $.ajax('data.json', {dataType: 'json'});
promise.then(function(data) {
    process(data);
});
promise.catch(function(errCode) {
    console.error(errCode);
});

Example code

Look at the source code of the unit tests to see what’s possible with miq.

Copyright

Miq is copyright 2016 Edwin Martin and released under the MIT license.

Edwin Martin <edwin@bitstorm.org>