javascript - What do these two onload methods have a different approach & which is better -

i writing onload function when stumbled across loadcss. onloadcss function works in different way.

my function

var onloadelement = function(element, callback) {      if (element.addeventlistener) {         element.addeventlistener("load", callback, 0);     } else if (element.readystate) {         element.onreadystatechange = callback;     } else {         element.onload = callback;     } } 

loadcss's function

function onloadcss( ss, callback ) {     ss.onload = function() {         ss.onload = null;         if( callback ) {             callback.call( ss );         }     };     // no support onload:     // weak inference targets android < 4.4     if( "isapplicationinstalled" in navigator && "onloadcssdefined" in ss ) {         ss.onloadcssdefined( callback );     } } 

clearly has added android support unclear of why ss.onload= callback not used instead of following snippet.

 ss.onload = null;  if( callback ) {      callback.call( ss );  } 

i've tried tweak function include non support .onload know whether modify further.

var onloadelement = function(element, callback) {      if (element.addeventlistener) {         element.addeventlistener("load", callback, false);     } else if (element.readystate) {         element.onreadystatechange = callback;     } else if(element.onload){         element.onload = callback;     } else if( "isapplicationinstalled" in navigator && "onloadcssdefined" in element ) {         element.onloadcssdefined( callback );     } } 

update

thanks mike-c answer, understand loadcss's approach save on memory.

so in theory reduce memory usage , have better browser support??

var onloadelement = function(element, callback) {      if(typeof callback !== 'function') return;      if (element.addeventlistener) {         var cb = function(){             callback.call( element );             element.removeeventlistener("load", cb)         }         element.addeventlistener("load", cb, false);     } else if (element.readystate) {         element.onreadystatechange = function(){             element.onreadystatechange = null;             callback.call( element );         }     } else if(element.onload){         element.onload = function(){             element.onload = null;             callback.call( element );         }     } else if( "isapplicationinstalled" in navigator && "onloadcssdefined" in element ) {         element.onloadcssdefined( callback );     } } 

good or bad idea?

their approach handles older browsers (all of if(element.addeventlistener) stuff) , removes event handler after load completes. may save on memory allows callback , event handler garbage collected.

update:

yes, new approach handles older browsers , should save memory since don't have dangling event handlers.