Получается миниатюрный аналог JQuery.
loadImage - для HTML5 Canvas,
DOM - для манипуляции с элементами (не путать с JQuery).
DOM(document).event({"DOMContentLoaded":function(){
DOM(document.getElementById("canvas")).attr({
"width":"100",
"height":"100"
}).css({
"background-color":"rgb(255,0,0)"
});
}});
Сам скрипт:
(function(){
var global = (function(){return this;})();
global.DOM = function(element){
var elem = element;
var obj = {};
//Set Attributes
obj.attr = function(src){
if(obj==null){obj={}}
if(src==null){src={}}
for(var i in src){
elem.setAttribute(i,src[i]);
}
return obj;
}
//Set CSS
obj.css = function(src){
if(obj==null){obj={}}
if(src==null){src={}}
for(var i in src){
if(typeof elem.style.setProperty != "undefined"){
elem.style.setProperty(i,src[i],null);
} else {
elem.style.setAttribute(i,src[i]);
}
}
return obj;
}
//Event Attach
obj.event = function(obj){
if(obj==null){obj={}}
for(var i in obj){
if(elem.addEventListener) {
elem.addEventListener(i, obj[i], false);
} else
if(elem.attachEvent) {
elem.attachEvent('on' + i, function(e){func.call(obj[i], e);});
}
}
return obj;
}
return obj;
};
global.loadImage = function(src,onload){
var img = new Image();
img.src = src;
img.onload = onload;
return img;
};
})();