JavaScript från Null Cross-Browser Event Binding

I kapitel fem i denna serie hoppade vi in ​​i den modiga världen av händelselyttare. I det avsnittet fick vi bara våra fötter våta; Men idag tar vi saker ytterligare ett steg när vi implementerar en mycket effektivare lösning. Under vägen lär vi oss en mängd nya tekniker.


Full Screencast



Vår sista kod

 var addEvent = (funktion (fönster, dokument) if (document.addEventListener) returfunktion (elem, typ, cb) if ((elem &&! elem.length) || elem === fönster) elem.addEventListener (typ, cb, false); annars om (elem && elem.length) var len = elem.length; för (var i = 0; i < len; i++ )  addEvent( elem[i], type, cb );   ;  else if ( document.attachEvent )  return function ( elem, type, cb )  if ( (elem && !elem.length) || elem === window )  elem.attachEvent( 'on' + type, function()  return cb.call(elem, window.event)  );  else if ( elem.length )  var len = elem.length; for ( var i = 0; i < len; i++ )  addEvent( elem[i], type, cb );   ;  )( this, document ); // Example Usage var lis = document.getElementsByTagName('li'); addEvent( window, 'click', function()  this.style.border = '1px solid red'; );

Observera att denna kod ändras något, baserat på en del bra feedback i kommentarfältet.