Hi All,
I''m new to the Prototype library, and liking it so far. I do have a
question about proper syntax for cross browser use of the $ method.
Which of the lines below is syntactically correct?
var x = $($(''myContainer'')).parentNode.className;
or
var x = $($(''myContainer'').parentNode).className;
TIA,
youngApprentice
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
$ is an alias for document.getElementById. It takes as its input the
ID attribute of some element on the page and returns the HTMLElement
object corresponding to to that ID.
$(''myContainer'') is therefore the element with
id="myContainer"
$(''myContainer'').parentNode is the parent node of the element
with
id="myContainer"
And $(''myContainer'').parentNode.className is the class name of
the
parent node of the element with id="myContainer"
You can use parentheses if you want (it''s also syntactically correct)
but it''s unnecessary.
As an aside, you probably don''t want to be messing with className
directly -- prototype has addClassName and removeClassName helpers to
add and remove class names, respectively.
On 5/19/07, youngApprentice
<tomgou-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:>
> Hi All,
>
> I''m new to the Prototype library, and liking it so far. I do have
a
> question about proper syntax for cross browser use of the $ method.
> Which of the lines below is syntactically correct?
>
> var x = $($(''myContainer'')).parentNode.className;
> or
> var x = $($(''myContainer'').parentNode).className;
>
> TIA,
>
> youngApprentice
>
>
> >
>
--
Jesse E.I. Farmer
e: jesse-h8Qh2m8E5SHQT0dZR+AlfA@public.gmane.org
w: http://20bits.com
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
Aren''t the parantheses needed for IE? See the bottom of http://www.prototypejs.org/learn/extensions TIA, youngApprentice On May 19, 3:10 pm, "Jesse Farmer" <farme...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> $ is an alias for document.getElementById. It takes as its input the > ID attribute of some element on the page and returns the HTMLElement > object corresponding to to that ID. > > $(''myContainer'') is therefore the element with id="myContainer" > > $(''myContainer'').parentNode is the parent node of the element with > id="myContainer" > > And $(''myContainer'').parentNode.className is the class name of the > parent node of the element with id="myContainer" > > You can use parentheses if you want (it''s also syntactically correct) > but it''s unnecessary. > > As an aside, you probably don''t want to be messing with className > directly -- prototype has addClassName and removeClassName helpers to > add and remove class names, respectively. > > On 5/19/07, youngApprentice <tom...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > > > > > Hi All, > > > I''m new to the Prototype library, and liking it so far. I do have a > > question about proper syntax for cross browser use of the $ method. > > Which of the lines below is syntactically correct? > > > var x = $($(''myContainer'')).parentNode.className; > > or > > var x = $($(''myContainer'').parentNode).className; > > > TIA, > > > youngApprentice > > -- > Jesse E.I. Farmer > e: j...-h8Qh2m8E5SHQT0dZR+AlfA@public.gmane.org > w:http://20bits.com--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Well, the easiest way to see would be to test it in IE.
But no, in your example, you do not need the paratheses or the double-$ trick.
In Javascript DOM elements are HTMLElement objects. Prototype extends
the HTMLElement objects to include methods like hide(), show(), etc.
This allows you to do stuff like $(''myDiv'').hide() rather than
Element.hide(''myDiv''). The former, however, only works on
properly
extended objects. The $ function on IE does not return an extended
object, so you don''t get the extra methods provided by Prototype.
parentNode and className, however, are not extended methods, so you
don''t need to do anything fancy to access them.
In short, you only need to resort to the Element.extend and double-$
workarounds when you''re trying to access extended methods or
attributes in a DOM object.
On 5/19/07, youngApprentice
<tomgou-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:>
> Aren''t the parantheses needed for IE? See the bottom of
> http://www.prototypejs.org/learn/extensions
>
> TIA,
> youngApprentice
>
> On May 19, 3:10 pm, "Jesse Farmer"
<farme...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> > $ is an alias for document.getElementById. It takes as its input the
> > ID attribute of some element on the page and returns the HTMLElement
> > object corresponding to to that ID.
> >
> > $(''myContainer'') is therefore the element with
id="myContainer"
> >
> > $(''myContainer'').parentNode is the parent node of
the element with
> > id="myContainer"
> >
> > And $(''myContainer'').parentNode.className is the
class name of the
> > parent node of the element with id="myContainer"
> >
> > You can use parentheses if you want (it''s also syntactically
correct)
> > but it''s unnecessary.
> >
> > As an aside, you probably don''t want to be messing with
className
> > directly -- prototype has addClassName and removeClassName helpers to
> > add and remove class names, respectively.
> >
> > On 5/19/07, youngApprentice
<tom...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
> >
> >
> >
> >
> >
> > > Hi All,
> >
> > > I''m new to the Prototype library, and liking it so far.
I do have a
> > > question about proper syntax for cross browser use of the $
method.
> > > Which of the lines below is syntactically correct?
> >
> > > var x =
$($(''myContainer'')).parentNode.className;
> > > or
> > > var x =
$($(''myContainer'').parentNode).className;
> >
> > > TIA,
> >
> > > youngApprentice
> >
> > --
> > Jesse E.I. Farmer
> > e: j...-h8Qh2m8E5SHQT0dZR+AlfA@public.gmane.org
> > w:http://20bits.com
>
>
> >
>
--
Jesse E.I. Farmer
e: jesse-h8Qh2m8E5SHQT0dZR+AlfA@public.gmane.org
w: http://20bits.com
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
Hey,
yes, you need them if you want to use the enriched prototype element
className is available in plain old element, so it will work
var x = $($(''myContainer'')).parentNode.className
is unnecessary. It is the same as:
var x = $(''myContainer'').parentNode.className
but
var x = $($(''myContainer'').parentNode).className
returns the prototype element which has hide() as method
and
var x = $(''myContainer'').parentNode.className
returns the plain old element which doesn''t know of hide()
if className is the only thing that is of interest for you the very first
might be already enough
.: Fabian
-----Original Message-----
From:
grbounce-_Pkz0AUAAAB9-VKt0-RY8LHUELm10l3Y=fabian.lange=web.de@googlegroups.c
om
[mailto:grbounce-_Pkz0AUAAAB9-VKt0-RY8LHUELm10l3Y=fabian.lange=web.de@google
groups.com] On Behalf Of youngApprentice
Sent: Samstag, 19. Mai 2007 21:27
To: Ruby on Rails: Spinoffs
Subject: [Rails-spinoffs] Re: Prototype cross browser $ syntax
Aren''t the parantheses needed for IE? See the bottom of
http://www.prototypejs.org/learn/extensions
TIA,
youngApprentice
On May 19, 3:10 pm, "Jesse Farmer"
<farme...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> $ is an alias for document.getElementById. It takes as its input the
> ID attribute of some element on the page and returns the HTMLElement
> object corresponding to to that ID.
>
> $(''myContainer'') is therefore the element with
id="myContainer"
>
> $(''myContainer'').parentNode is the parent node of the
element with
> id="myContainer"
>
> And $(''myContainer'').parentNode.className is the class
name of the
> parent node of the element with id="myContainer"
>
> You can use parentheses if you want (it''s also syntactically
correct)
> but it''s unnecessary.
>
> As an aside, you probably don''t want to be messing with className
> directly -- prototype has addClassName and removeClassName helpers to
> add and remove class names, respectively.
>
> On 5/19/07, youngApprentice
<tom...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:
>
>
>
>
>
> > Hi All,
>
> > I''m new to the Prototype library, and liking it so far. I do
have a
> > question about proper syntax for cross browser use of the $ method.
> > Which of the lines below is syntactically correct?
>
> > var x = $($(''myContainer'')).parentNode.className;
> > or
> > var x = $($(''myContainer'').parentNode).className;
>
> > TIA,
>
> > youngApprentice
>
> --
> Jesse E.I. Farmer
> e: j...-h8Qh2m8E5SHQT0dZR+AlfA@public.gmane.org
> w:http://20bits.com
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
Hi,
This is a complex issue. Re-read http://www.prototypejs.org/learn/extensions
to fully understand the details.
To sum-up, $() does two things, it finds an element by is AND extends
it with Prototype''s own Element methods (needed for IE).
So:
$(''myContainer'').parentNode.className =
''selected'' // this will work,
because className is not a Prototype Element method.
$(''myContainer'').parentNode.addClassName(''selected'')
// this will NOT
work, because addClassName is a Prototype Element method.
$($(''myContainer'').parentNode).addClassName(''selected'')
// this will
work, because myContainer''s parentNode has been extended by $().
$(''myContainer'').up().addClassName(''selected'')
// this will work,
because Element#up() automatically extends the element it returns.
Hope that clarified the issue.
-- Tobie
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
Thanks Tobie and everyone, Thanks also for your work on JSON support in Prototype! On May 19, 5:08 pm, tobie <tobie.lan...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> Hi, > > This is a complex issue. Re-readhttp://www.prototypejs.org/learn/extensions > to fully understand the details. > > To sum-up, $() does two things, it finds an element by is AND extends > it with Prototype''s own Element methods (needed for IE). > > So: > > $(''myContainer'').parentNode.className = ''selected'' // this will work, > because className is not a Prototype Element method. > $(''myContainer'').parentNode.addClassName(''selected'') // this will NOT > work, because addClassName is a Prototype Element method. > $($(''myContainer'').parentNode).addClassName(''selected'') // this will > work, because myContainer''s parentNode has been extended by $(). > $(''myContainer'').up().addClassName(''selected'') // this will work, > because Element#up() automatically extends the element it returns. > > Hope that clarified the issue. > > -- Tobie--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---
Thanks Jesse, Tobie and You really cleared things up for me. I was simply using className to see if my code was working in IE, etc. by alerting the value of the className. Turns out my mistaken syntax was working one way versus another, but now I''m on the right track. I needed to read the "How Prototype extends the DOM" article about three times now, but I get it now! On May 19, 3:10 pm, "Jesse Farmer" <farme...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote:> $ is an alias for document.getElementById. It takes as its input the > ID attribute of some element on the page and returns the HTMLElement > object corresponding to to that ID. > > $(''myContainer'') is therefore the element with id="myContainer" > > $(''myContainer'').parentNode is the parent node of the element with > id="myContainer" > > And $(''myContainer'').parentNode.className is the class name of the > parent node of the element with id="myContainer" > > You can use parentheses if you want (it''s also syntactically correct) > but it''s unnecessary. > > As an aside, you probably don''t want to be messing with className > directly -- prototype has addClassName and removeClassName helpers to > add and remove class names, respectively. > > On 5/19/07, youngApprentice <tom...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org> wrote: > > > > > > > Hi All, > > > I''m new to the Prototype library, and liking it so far. I do have a > > question about proper syntax for cross browser use of the $ method. > > Which of the lines below is syntactically correct? > > > var x = $($(''myContainer'')).parentNode.className; > > or > > var x = $($(''myContainer'').parentNode).className; > > > TIA, > > > youngApprentice > > -- > Jesse E.I. Farmer > e: j...-h8Qh2m8E5SHQT0dZR+AlfA@public.gmane.org > w:http://20bits.com--~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---