[jQuery] Re: Click Links in the Nnavigation Bar
On Feb 4, 2009, at 1:09 AM, Pedram wrote: Thanks Karl , It helped me alot Not a problem. Glad to help. Since it's not possible in a valid DOM to have an A that is a descendant of a UL but not a descendant of an LI, the LI is superfluous. No need to do an extra getElementsByTagName there. On second thought, I'm not sure that there would actually be an extra getElementsByTagName as of jQuery 1.3, since Sizzle (1.3's selector engine) starts on the right side of the selector and then walks up the DOM tree, checking for matches on each selector to the left in turn. It might still matter, but it probably matters less. Please don't take these musings as fact, though. I have not run any comparative benchmarks. You would have to do that to know for sure which is faster. If someone else has benchmarks on these things, I'd be interested to see them. Also, I haven't taken a close look at Sizzle, so my understanding of it could be off. Please, anyone, feel free to correct me. Cheers, --Karl Karl Swedberg www.englishrules.com www.learningjquery.com
[jQuery] Re: Click Links in the Nnavigation Bar
Thanks Karl , It helped me alot On Feb 1, 9:47 am, Karl Swedberg wrote: > On Feb 1, 2009, at 3:06 AM, Pedram wrote: > > > > > I have another tiny question > > $("Ul li a"), $("ul a"), $("a",$("ul")) > > which one has the great performance !!? > > I would go with either $('ul a') or $('a', 'ul'), but $('ul a') seems > more readable to me, as it follows the CSS syntax. > > Since it's not possible in a valid DOM to have an A that is a > descendant of a UL but not a descendant of an LI, the LI is > superfluous. No need to do an extra getElementsByTagName there. > > Also, if you're using a contextual selector, you don't need to wrap > the context in its own jQuery object -- $("a",$("ul")). > > --Karl > > > On Feb 1, 12:02 am, Pedram wrote: > >> I just had some Doubt , the performance is great > > >> On Jan 31, 11:54 am, Karl Swedberg wrote: > > >>> Hi Pedram, > > >>> I agree with Nic. Especially if you're only dealing with 4 elements, > >>> binding directly on them seems like the most sensible solution. > > >>> Are you noticing performance problems? You shouldn't be seeing any, > >>> with scripts this basic. In any case, there are a couple selector > >>> optimizations you could implement, if necessary. Something like > >>> this: > > >>> var $navBarLinks = $('#your-nav-bar-id a'); > > >>> $navBarLinks.click(function() { > >>> $navBarLinks.removeClass('active'); > >>> $(this).addClass('active'); > > >>> }); > > >>> --Karl > > >>> > >>> Karl Swedbergwww.englishrules.comwww.learningjquery.com > > >>> On Jan 31, 2009, at 2:36 PM, Pedram wrote: > > I'm looking to improve the performance , which of these 2 codes > has > the best performance. > > On Jan 30, 1:04 am, Nic Luciano wrote: > > What exactly are you trying to do, what is the issue? Maybe just > > preference > > here (and I'm also just guessing what you're asking) but I don't > > see a > > reason not to put the events on the elements themselves > > > $("ul li a").click(function() { > > $ > > (this).parent().parent().find(".active").removeClass("active"); > > $(this).addClass("active"); > > }); > > > On Fri, Jan 30, 2009 at 3:07 AM, Pedram > > wrote: > > >> Dear Karl , > >> I know You are Expert in these Issues do you have any idea for me > >> Thanks > > >> On Jan 29, 5:44 pm, Pedram wrote: > >>> Hi Folks , > >>> I have some links in my Navigation bar such as below , I Used > >>> FIND > >>> in my code , does anyone has any better solution for me , > >>> I also used Event Delegation in the system . > > >>> > >>> b > >>> c > >>> d > >>> > > >>> $("ul").bind("click",function(e){ > >>> var clicked=$(e.target); > >>> $(this).find("a.active").removeClass("active"); > >>> clicked.addClass("active"); > >>> });
[jQuery] Re: Click Links in the Nnavigation Bar
On Feb 1, 2009, at 3:06 AM, Pedram wrote: I have another tiny question $("Ul li a"), $("ul a"), $("a",$("ul")) which one has the great performance !!? I would go with either $('ul a') or $('a', 'ul'), but $('ul a') seems more readable to me, as it follows the CSS syntax. Since it's not possible in a valid DOM to have an A that is a descendant of a UL but not a descendant of an LI, the LI is superfluous. No need to do an extra getElementsByTagName there. Also, if you're using a contextual selector, you don't need to wrap the context in its own jQuery object -- $("a",$("ul")). --Karl On Feb 1, 12:02 am, Pedram wrote: I just had some Doubt , the performance is great On Jan 31, 11:54 am, Karl Swedberg wrote: Hi Pedram, I agree with Nic. Especially if you're only dealing with 4 elements, binding directly on them seems like the most sensible solution. Are you noticing performance problems? You shouldn't be seeing any, with scripts this basic. In any case, there are a couple selector optimizations you could implement, if necessary. Something like this: var $navBarLinks = $('#your-nav-bar-id a'); $navBarLinks.click(function() { $navBarLinks.removeClass('active'); $(this).addClass('active'); }); --Karl Karl Swedbergwww.englishrules.comwww.learningjquery.com On Jan 31, 2009, at 2:36 PM, Pedram wrote: I'm looking to improve the performance , which of these 2 codes has the best performance. On Jan 30, 1:04 am, Nic Luciano wrote: What exactly are you trying to do, what is the issue? Maybe just preference here (and I'm also just guessing what you're asking) but I don't see a reason not to put the events on the elements themselves $("ul li a").click(function() { $ (this).parent().parent().find(".active").removeClass("active"); $(this).addClass("active"); }); On Fri, Jan 30, 2009 at 3:07 AM, Pedram wrote: Dear Karl , I know You are Expert in these Issues do you have any idea for me Thanks On Jan 29, 5:44 pm, Pedram wrote: Hi Folks , I have some links in my Navigation bar such as below , I Used FIND in my code , does anyone has any better solution for me , I also used Event Delegation in the system . b c d $("ul").bind("click",function(e){ var clicked=$(e.target); $(this).find("a.active").removeClass("active"); clicked.addClass("active"); });
[jQuery] Re: Click Links in the Nnavigation Bar
I have another tiny question $("Ul li a"), $("ul a"), $("a",$("ul")) which one has the great performance !!? On Feb 1, 12:02 am, Pedram wrote: > I just had some Doubt , the performance is great > > On Jan 31, 11:54 am, Karl Swedberg wrote: > > > Hi Pedram, > > > I agree with Nic. Especially if you're only dealing with 4 elements, > > binding directly on them seems like the most sensible solution. > > > Are you noticing performance problems? You shouldn't be seeing any, > > with scripts this basic. In any case, there are a couple selector > > optimizations you could implement, if necessary. Something like this: > > > var $navBarLinks = $('#your-nav-bar-id a'); > > > $navBarLinks.click(function() { > > $navBarLinks.removeClass('active'); > > $(this).addClass('active'); > > > }); > > > --Karl > > > > > Karl Swedbergwww.englishrules.comwww.learningjquery.com > > > On Jan 31, 2009, at 2:36 PM, Pedram wrote: > > > > I'm looking to improve the performance , which of these 2 codes has > > > the best performance. > > > > On Jan 30, 1:04 am, Nic Luciano wrote: > > >> What exactly are you trying to do, what is the issue? Maybe just > > >> preference > > >> here (and I'm also just guessing what you're asking) but I don't > > >> see a > > >> reason not to put the events on the elements themselves > > > >> $("ul li a").click(function() { > > >> $ > > >> (this).parent().parent().find(".active").removeClass("active"); > > >> $(this).addClass("active"); > > >> }); > > > >> On Fri, Jan 30, 2009 at 3:07 AM, Pedram wrote: > > > >>> Dear Karl , > > >>> I know You are Expert in these Issues do you have any idea for me > > >>> Thanks > > > >>> On Jan 29, 5:44 pm, Pedram wrote: > > Hi Folks , > > I have some links in my Navigation bar such as below , I Used > > FIND > > in my code , does anyone has any better solution for me , > > I also used Event Delegation in the system . > > > > > b > > c > > d > > > > > $("ul").bind("click",function(e){ > > var clicked=$(e.target); > > $(this).find("a.active").removeClass("active"); > > clicked.addClass("active"); > > });
[jQuery] Re: Click Links in the Nnavigation Bar
I just had some Doubt , the performance is great On Jan 31, 11:54 am, Karl Swedberg wrote: > Hi Pedram, > > I agree with Nic. Especially if you're only dealing with 4 elements, > binding directly on them seems like the most sensible solution. > > Are you noticing performance problems? You shouldn't be seeing any, > with scripts this basic. In any case, there are a couple selector > optimizations you could implement, if necessary. Something like this: > > var $navBarLinks = $('#your-nav-bar-id a'); > > $navBarLinks.click(function() { > $navBarLinks.removeClass('active'); > $(this).addClass('active'); > > }); > > --Karl > > > Karl Swedbergwww.englishrules.comwww.learningjquery.com > > On Jan 31, 2009, at 2:36 PM, Pedram wrote: > > > > > I'm looking to improve the performance , which of these 2 codes has > > the best performance. > > > On Jan 30, 1:04 am, Nic Luciano wrote: > >> What exactly are you trying to do, what is the issue? Maybe just > >> preference > >> here (and I'm also just guessing what you're asking) but I don't > >> see a > >> reason not to put the events on the elements themselves > > >> $("ul li a").click(function() { > >> $ > >> (this).parent().parent().find(".active").removeClass("active"); > >> $(this).addClass("active"); > >> }); > > >> On Fri, Jan 30, 2009 at 3:07 AM, Pedram wrote: > > >>> Dear Karl , > >>> I know You are Expert in these Issues do you have any idea for me > >>> Thanks > > >>> On Jan 29, 5:44 pm, Pedram wrote: > Hi Folks , > I have some links in my Navigation bar such as below , I Used > FIND > in my code , does anyone has any better solution for me , > I also used Event Delegation in the system . > > > b > c > d > > > $("ul").bind("click",function(e){ > var clicked=$(e.target); > $(this).find("a.active").removeClass("active"); > clicked.addClass("active"); > });
[jQuery] Re: Click Links in the Nnavigation Bar
Thanks Karl , You are Right , I appreciate it , thank you again . You are always the solver On Jan 31, 11:54 am, Karl Swedberg wrote: > Hi Pedram, > > I agree with Nic. Especially if you're only dealing with 4 elements, > binding directly on them seems like the most sensible solution. > > Are you noticing performance problems? You shouldn't be seeing any, > with scripts this basic. In any case, there are a couple selector > optimizations you could implement, if necessary. Something like this: > > var $navBarLinks = $('#your-nav-bar-id a'); > > $navBarLinks.click(function() { > $navBarLinks.removeClass('active'); > $(this).addClass('active'); > > }); > > --Karl > > > Karl Swedbergwww.englishrules.comwww.learningjquery.com > > On Jan 31, 2009, at 2:36 PM, Pedram wrote: > > > > > I'm looking to improve the performance , which of these 2 codes has > > the best performance. > > > On Jan 30, 1:04 am, Nic Luciano wrote: > >> What exactly are you trying to do, what is the issue? Maybe just > >> preference > >> here (and I'm also just guessing what you're asking) but I don't > >> see a > >> reason not to put the events on the elements themselves > > >> $("ul li a").click(function() { > >> $ > >> (this).parent().parent().find(".active").removeClass("active"); > >> $(this).addClass("active"); > >> }); > > >> On Fri, Jan 30, 2009 at 3:07 AM, Pedram wrote: > > >>> Dear Karl , > >>> I know You are Expert in these Issues do you have any idea for me > >>> Thanks > > >>> On Jan 29, 5:44 pm, Pedram wrote: > Hi Folks , > I have some links in my Navigation bar such as below , I Used > FIND > in my code , does anyone has any better solution for me , > I also used Event Delegation in the system . > > > b > c > d > > > $("ul").bind("click",function(e){ > var clicked=$(e.target); > $(this).find("a.active").removeClass("active"); > clicked.addClass("active"); > });
[jQuery] Re: Click Links in the Nnavigation Bar
Hi Pedram, I agree with Nic. Especially if you're only dealing with 4 elements, binding directly on them seems like the most sensible solution. Are you noticing performance problems? You shouldn't be seeing any, with scripts this basic. In any case, there are a couple selector optimizations you could implement, if necessary. Something like this: var $navBarLinks = $('#your-nav-bar-id a'); $navBarLinks.click(function() { $navBarLinks.removeClass('active'); $(this).addClass('active'); }); --Karl Karl Swedberg www.englishrules.com www.learningjquery.com On Jan 31, 2009, at 2:36 PM, Pedram wrote: I'm looking to improve the performance , which of these 2 codes has the best performance. On Jan 30, 1:04 am, Nic Luciano wrote: What exactly are you trying to do, what is the issue? Maybe just preference here (and I'm also just guessing what you're asking) but I don't see a reason not to put the events on the elements themselves $("ul li a").click(function() { $ (this).parent().parent().find(".active").removeClass("active"); $(this).addClass("active"); }); On Fri, Jan 30, 2009 at 3:07 AM, Pedram wrote: Dear Karl , I know You are Expert in these Issues do you have any idea for me Thanks On Jan 29, 5:44 pm, Pedram wrote: Hi Folks , I have some links in my Navigation bar such as below , I Used FIND in my code , does anyone has any better solution for me , I also used Event Delegation in the system . b c d $("ul").bind("click",function(e){ var clicked=$(e.target); $(this).find("a.active").removeClass("active"); clicked.addClass("active"); });
[jQuery] Re: Click Links in the Nnavigation Bar
I'm looking to improve the performance , which of these 2 codes has the best performance. On Jan 30, 1:04 am, Nic Luciano wrote: > What exactly are you trying to do, what is the issue? Maybe just preference > here (and I'm also just guessing what you're asking) but I don't see a > reason not to put the events on the elements themselves > > $("ul li a").click(function() { > $(this).parent().parent().find(".active").removeClass("active"); > $(this).addClass("active"); > }); > > On Fri, Jan 30, 2009 at 3:07 AM, Pedram wrote: > > > Dear Karl , > > I know You are Expert in these Issues do you have any idea for me > > Thanks > > > On Jan 29, 5:44 pm, Pedram wrote: > > > Hi Folks , > > > I have some links in my Navigation bar such as below , I Used FIND > > > in my code , does anyone has any better solution for me , > > > I also used Event Delegation in the system . > > > > > > > b > > > c > > > d > > > > > > > $("ul").bind("click",function(e){ > > > var clicked=$(e.target); > > > $(this).find("a.active").removeClass("active"); > > > clicked.addClass("active"); > > > });
[jQuery] Re: Click Links in the Nnavigation Bar
What exactly are you trying to do, what is the issue? Maybe just preference here (and I'm also just guessing what you're asking) but I don't see a reason not to put the events on the elements themselves $("ul li a").click(function() { $(this).parent().parent().find(".active").removeClass("active"); $(this).addClass("active"); }); On Fri, Jan 30, 2009 at 3:07 AM, Pedram wrote: > > Dear Karl , > I know You are Expert in these Issues do you have any idea for me > Thanks > > On Jan 29, 5:44 pm, Pedram wrote: > > Hi Folks , > > I have some links in my Navigation bar such as below , I Used FIND > > in my code , does anyone has any better solution for me , > > I also used Event Delegation in the system . > > > > > > b > > c > > d > > > > > > $("ul").bind("click",function(e){ > > var clicked=$(e.target); > > $(this).find("a.active").removeClass("active"); > > clicked.addClass("active"); > > }); >
[jQuery] Re: Click Links in the Nnavigation Bar
Dear Karl , I know You are Expert in these Issues do you have any idea for me Thanks On Jan 29, 5:44 pm, Pedram wrote: > Hi Folks , > I have some links in my Navigation bar such as below , I Used FIND > in my code , does anyone has any better solution for me , > I also used Event Delegation in the system . > > > b > c > d > > > $("ul").bind("click",function(e){ > var clicked=$(e.target); > $(this).find("a.active").removeClass("active"); > clicked.addClass("active"); > });