Liam,
$() can take one or two arguments. The first argument is what your
searching for. The second argument is the context in which you are
searching. If you only use one argument, the second defaults to the
whole dom.
$("#foo p") searches for all p in #foo. It does this by getting every
p element in the document and then selecting the ones inside #foo.
The other option uses a second argument to limit the scope. $("#foo")
returns #foo. $("p", $("#foo")) uses #foo as its context instead of
the whole dom.
Just to clarify, $("p", "#foo") would be meaningless, because #foo
isn't its own context. It needs to be an object returned by jquery. $
("p, #foo") would give you both all p's and all #foo's, which is not
what you want in this circumstance.
On Feb 24, 8:49 am, Liam Potter <radioactiv...@gmail.com> wrote:
> ok, but what in jquery knows that $("p", $("#foo")) should look for the
> p tags inside of #foo, why does it treat it like $("#foo p")?
>
>
>
> jQuery Lover wrote:
> > Liam, you can use $("p", "#foo"). The second parameter must be a
> > jQuery object or dom element...
>
> > ----
> > Read jQuery HowTo Resource - http://jquery-howto.blogspot.com
>
> > On Tue, Feb 24, 2009 at 6:44 PM, Liam Potter <radioactiv...@gmail.com>
> > wrote:
>
> >> Hi Stehpan :p
>
> >> I understand that, I'm just not sure why $("p", $("#foo")) is not the same
> >> as $("p", "#foo")
>
> >> - Liam
>
> >> Stephan Veigl wrote:
>
> >>> Hi Lima,
>
> >>> 1) #foo is an ID and since IDs should be unique there has to bee only
> >>> one #foo element
>
> >>> 2) $("p", $("#foo")) selects all <p> elements in the scope of the #foo
> >>> element.
> >>> In other words, it selects every <p> element under #foo in the DOM tree.
>
> >>> by(e)
> >>> Stephan
>
> >>> 2009/2/24 Liam Potter <radioactiv...@gmail.com>:
>
> >>>> I've been following this discussion, but I need explaining why $("p",
> >>>> $("#foo")) doesn't select all p tags and all #foo id's ?
>
> >>>> Stephan Veigl wrote:
>
> >>>>> Hi,
>
> >>>>> I've done some profiling on this, and $("p", $("#foo")) is faster than
> >>>>> $("#foo p") in both jQuery 1.2.6 and 1.3.2.
>
> >>>>> the test HTML consists of 100 <p>s in a "foo" <div> and 900 <p>s in a
> >>>>> "bar" <div>.
>
> >>>>> However the factor differs dramatically:
> >>>>> In 1.2.6 the speedup from $("p", $("#foo")) to $("#foo p") was between
> >>>>> 1.5x (FF) and 2x (IE),
> >>>>> while for 1.3.2 the speedup is 20x (FF) and 15x (IE).
>
> >>>>> $("p", $("#foo")) is faster in 1.3.2, by a factor of 1.5 (both FF and
> >>>>> IE),
> >>>>> while $("#foo p") is _slower_ in 1.3.2 by 8.5x (FF) and 4.6x (IE).
>
> >>>>> Even with an empty "bar" div $("p", $("#foo")) is faster by a factor up
> >>>>> to
> >>>>> 3x.
>
> >>>>> Conclusion:
> >>>>> If you have an ID selector, first get the element by it's ID and use
> >>>>> it as scope for further selects.
>
> >>>>> by(e)
> >>>>> Stephan
> >>>>> 2009/2/23 ricardobeat <ricardob...@gmail.com>:
>
> >>>>>> up to jQuery 1.2.6 that's how the selector engine worked (from the top
> >>>>>> down/left to right). The approach used in Sizzle (bottom up/right to
> >>>>>> left) has both benefits and downsides - it can be much faster on large
> >>>>>> DOMs and some situations, but slower on short queries. I'm sure
> >>>>>> someone can explain that in better detail.
>
> >>>>>> Anyway, in modern browsers most of the work is being delegated to the
> >>>>>> native querySelectorAll function, as so selector performance will
> >>>>>> become more of a browser makers' concern.
>
> >>>>>> - ricardo
>
> >>>>>> On Feb 23, 1:08 pm, Peter Bengtsson <pete...@gmail.com> wrote:
>
> >>>>>>> I watched the John Resig presentation too and learned that CSS
> >>>>>>> selectors always work from right to left.
> >>>>>>> That would mean that doing this::
>
> >>>>>>> $('#foo p')
>
> >>>>>>> Would extract all <p> tags and from that list subselect those who
> >>>>>>> belong to #foo. Suppose you have 1000 <p> tags of them only 100 are
> >>>>>>> inside #foo you'll have wasted 900 loops.
>
> >>>>>>> Surely $('#foo') is the fastest lookup possible. Doing it this way
> >>>>>>> will effectively limit the scope of the $('p') search and you will
> >>>>>>> never be bothered about any <p> tags outside #foo.
>
> >>>>>>> Or am I talking rubbish?
