Is the JS Object correctly created and rightly did I understand its work

Question

Here is the JS Object :

(function () { if(window.$DOM) return; var domObj = function (element, context) { return new domObj.fn.Init(context, element); }; domObj.fn = domObj.prototype = { Init: function (context, element) { this.element = element; if(!context) this.context = document; else this.context = context; } }, AddEvent: function (event, handler) { var object = this.element; if (!object) return; if (object.attachEvent) object.attachEvent('on' + event, handler); else if (object.addEventListener) object.addEventListener(event, handler, false); return this; }, RemoveEvent: function (event, handler) { var object = this.element; if (!object) return; if (object.detachEvent) { object.detachEvent("on" + event, handler); } else if (object.removeEventListener) { object.removeEventListener(event, handler, false); } return this; }, }; domObj.fn.Init.prototype = domObj.fn; window.$DOM = domObj; })();

Here I use it:

 function click(){ alert("click!"); } $DOM("buttont").AddEvent("click", click); $DOM("buttont").RemoveEvent("click", click);

Do I understand correctly that 2 domObj.prototype.Init{this.element=...; this.context=...} domObj.prototype.Init{this.element=...; this.context=...} and AddEvent and RemoveEvent will be called from prototype and passed to the created domObj.prototype.Init as this ?

object - it is better not to use as a variable name. But in general - terrible spaghetti ... The answer to your question is yes
your code can be reduced, offhand, by about 40% ... **** I would not say that the code is terrible, but obviously too much water

Accepted Answer · 2012-01-04T13:24:25

IMHO - how to do this task:

 (function () { if(window.$DOM) return; var obj = function ( element, context ) { this.context = context || document; this.element = element; }; if ( document.body.addEventListener ){ obj.prototype.listen = function ( event, handler ){ this.element.addEventListener( event, handler, false ); return this; } obj.prototype.unlisten = function ( event, handler ){ this.element.removeEventListener( event, handler, false ); return this; } } else if ( document.body.attachEvent ){ obj.prototype.listen = function ( event, handler ){ this.element.attachEvent( 'on' + event, handler ); return this; } obj.prototype.unlisten = function ( event, handler ){ this.element.detachEvent( 'on' + event, handler ); return this; } } else throw Error( "Я не знаю как вешать обработчик в этом браузере" ); window.$DOM = function ( el, context ){ if ( typeof element === 'string' ) el = document.getElementById( el ); return ( el.$dom || el.$dom = new obj( el, context ) ); } })();

And correspondingly:

 $DOM( 'buttont' ).listen( 'click', click ); $DOM( 'buttont' ).unlisten( 'click', click );

What would prototype be 1 time, you can:

 (function () { if(window.$DOM) return; var obj = function ( element, context ) { this.context = context || document; this.element = element; }, event_flag; if ( document.body.addEventListener ) event_flag = true; else if ( document.body.attachEvent ) event_flag = false; else throw Error( "Я не знаю как вешать обработчик в этом браузере" ); obj.prototype = { constructor: obj, listen: ( event_flag ? function ( event, handler ){ this.element.addEventListener( event, handler, false ); return this; } : function ( event, handler ){ this.element.attachEvent( 'on' + event, handler ); return this; } ), unlisten: ( event_flag ? function ( event, handler ){ this.element.removeEventListener( event, handler, false ); return this; } : function ( event, handler ){ this.element.detachEvent( 'on' + event, handler ); return this; } ) } window.$DOM = function ( el, context ){ if ( typeof element === 'string' ) el = document.getElementById( el ); return ( el.$dom || el.$dom = new obj( el, context ) ); } })();

But I wouldn't ...

Is the JS Object correctly created and rightly did I understand its work

1 answer 1

More articles: