But it's so easy to use event delegation that you may as well just do it -
then you don't sacrifice any performance, no matter how many elements you
have.
 
For example:
 
<div id="outer">
    <div class="clicker" id="one">one</div>
    <div class="clicker" id="two">two</div> 
    <div class="clicker" id="three">three</div>
</div>
 
$(function() {
    $('#outer').click( function( event ) {
        var target = event.target;
        if( $(target).is('div.clicker') ) {
            alert( 'You clicked me: ' + target.id + '!' );
        }
    });
});
 
Isaak, FYI, .each() is nothing fancy - it's simply an ordinary for loop that
calls your callback function in each iteration. But with event delegation
you don't even have to use it: a single event handler does any number of
elements.
 
-Mike


  _____  

From: Josh Nathanson

You are sacrificing a small bit of performance for a world of easier code
development and maintenance.  In nearly all cases it's a worthwhile trade.
 
If you had 1000 or more divs you'd probably not want to use each() to bind
the handlers, but for any reasonably small number of elements, the
performance hit is ok.  Plus, binding speed has been improved in jQuery
1.2.6.
 
-- Josh
 

----- Original Message ----- 
From: Isaak Malik <mailto:[EMAIL PROTECTED]>  
To: jquery-en@googlegroups.com 
Sent: Wednesday, June 11, 2008 1:56 PM
Subject: [jQuery] jQuery.each() or element event triggers?


Dear list,

I'm not really into the code of the jQuery core so I'm not sure of how
jQuery.each() works, but I'm wondering: since jQuery.each() loops through
every element that matches the given selector is my logics right that is it
better performance wise to use static element event trigger instead of using
the each() method on all the elements?

An example for the simple-minded:

$('div').each(function(){$(this).click(function(){alert('You clicked me: ' +
this.id + '!')})})

or

<div id='blabla1' onclick="alert('You clicked me: ' + this.id + '!')"></div>
<div id='blabla2' onclick="alert('You clicked me: ' + this.id + '!')"></div>
<div id='blabla3' onclick="alert('You clicked me: ' + this.id + '!')"></div>

?

In most cases it does take more characters for the same functionality but
what are the differences in performance?

Kind regards,
-- 
Isaak Malik
Web Developer 

Reply via email to