Skip to content

Latest commit

 

History

History
82 lines (71 loc) · 2.58 KB

README.md

File metadata and controls

82 lines (71 loc) · 2.58 KB

DOMinator

If you ever get tired of declaring DOM elements like that:

var formNode, submitButtonNode, nameInputNode, emailInputNode;
window.onload = function(){
    formNode = document.getElementById('form');
    submitButtonNode = document.getElementById('submit');
    nameInputNode = document.getElementById('name');
    emailInputNode = document.getElementById('email');
    console.log(formNode, submitButtonNode, nameInputNode, emailInputNode);
}

You've come to the right place!

introducing: DOMinator

DOMinator gives you easy and worry-less access to DOM elements, without having to declare each and every one of them individually.

example

The code above is replaced by this:

var dominator = Dominator.getInstance();
dominator.initIds('form', 'submit', 'name', 'email');
dominator.onReady(function (dom) {
    console.log(dom.form, dom.submit, dom.name, dom.email);
});

how to use

Include either dominator.js or dominator.min.js in your web page, and you're good to go with var dominator = Dominator.getInstance();

functionality

dominator.initId

Use this function to register a new DOM element, to be accessed later by dominator.dom[id]:

dominator.initId('foo');

dominator.initIds

Similar to dominator.initId, but works on multiple ids passed either as an array or as an open-ended arguments list:

dominator.initIds(['foo', 'bar']);//this works
dominator.initIds('oof', 'rab');//this works too!

dominator.onReady

This function receives a callback which is fired once the document is actually loaded, and DOM initialization is done. The callback is executed with all the DOM elements as the first and only argument. This function may also receive ids to be initialized, as shown:

dominator.initId('foo');
dominator.onReady(function (dom) {
	//dom.foo
});
dominator.onReady('bar', function (dom) {
	//dom.bar
});

dominator.dom

Ue this getter to access DOM elements directly, without the need for dominator.onReady (if for some legacy issues you have to use window.onload:

dominator.initId('foo');
window.onload = function(){
	//dominator.dom.foo
};

tests

DOMinator is fully tested. Local tests can be easily run by:

$ grunt test

build

Minified version can be found under build folder, and is generated by running:

$ grunt build

###Thats it! Let me know if you encounter any issues, and feel free to send me pull requests if you have some bug fixes and/or improvements :)