threethirdsfull-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org
2007-Jun-21 15:15 UTC
Problem with accessing Dom objects if they are anchor tags
Hi I have a problem that I have never come across before while using
prototype...
I am using this selector $$(''a.switch''), and I had expected
and array
of DOM objects to be returned e.g.
[object HTMLAElement],[object HTMLAElement],[object HTMLAElement],
[object HTMLAElement]
but what I get is and array that contains the href value of the a tags
e.g.
http://www.domain.co.uk/page.html#
Is this a bug or am I missing something... I have some more long
winded javascript that works but I wanted to use the new CSS selectors
here is the code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<meta name="title" content="Expandable Div" />
<meta name="robots" content="index, follow" />
<meta name="description" content="checkbox" />
<meta name="keywords" content="checkbox" />
<meta name="language" content="en" />
<title>Expandable Div</title>
<link rel="shortcut icon" href="/favicon.ico" />
<script type="text/javascript"
src="js/prototype.js"></script>
<script type="text/javascript"
src="js/scriptaculous.js"></script>
<link rel="stylesheet" type="text/css"
media="screen" href="css/
master.css" />
</head>
<body>
<h1>Expandable Div Example</h1>
<div>
<a href="#" id="switch1"
class="switch">Click to expand 1</a>
<div id="region1" class="stretcher" style="display:
none">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam
vehicula dapibus nibh.
Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet,
sapien enim fringilla velit,
sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse
platea dictumst. Nulla facilisi.
Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent
nulla nulla, posuere quis,
bibendum non, vestibulum sed, risus. Donec mollis hendrerit libero.
Fusce eleifend lacus non
augue. In venenatis turpis ac diam.</p>
<p>Nam feugiat, metus a ultricies dictum, diam nibh convallis est,
ut pellentesque ipsum dolor
placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue.
Vestibulum nec magna. Fusce convallis.
Donec blandit. Morbi lobortis magna et nulla. Aenean varius lectus
id nisl. Nam vestibulum.
Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris.
Integer turpis. Vivamus ut
arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a, enim.
In gravida eros.
Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing
venenatis arcu.</p>
</div>
</div>
<div>
<a href="#" id="switch2"
class="switch">Click to expand 2</a>
<div id="region2" class="stretcher" style="display:
none">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam
vehicula dapibus nibh.
Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet,
sapien enim fringilla velit,
sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse
platea dictumst. Nulla facilisi.
Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent
nulla nulla, posuere quis,
bibendum non, vestibulum sed, risus. Donec mollis hendrerit libero.
Fusce eleifend lacus non
augue. In venenatis turpis ac diam.</p>
<p>Nam feugiat, metus a ultricies dictum, diam nibh convallis est,
ut pellentesque ipsum dolor
placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue.
Vestibulum nec magna. Fusce convallis.
Donec blandit. Morbi lobortis magna et nulla. Aenean varius lectus
id nisl. Nam vestibulum.
Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris.
Integer turpis. Vivamus ut
arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a, enim.
In gravida eros.
Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing
venenatis arcu.</p>
</div>
</div>
<div>
<a href="#" id="switch3"
class="switch">Click to expand 3</a>
<div id="region3" class="stretcher" style="display:
none">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam
vehicula dapibus nibh.
Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet,
sapien enim fringilla velit,
sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse
platea dictumst. Nulla facilisi.
Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent
nulla nulla, posuere quis,
bibendum non, vestibulum sed, risus. Donec mollis hendrerit libero.
Fusce eleifend lacus non
augue. In venenatis turpis ac diam.</p>
<p>Nam feugiat, metus a ultricies dictum, diam nibh convallis est,
ut pellentesque ipsum dolor
placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue.
Vestibulum nec magna. Fusce convallis.
Donec blandit. Morbi lobortis magna et nulla. Aenean varius lectus
id nisl. Nam vestibulum.
Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris.
Integer turpis. Vivamus ut
arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a, enim.
In gravida eros.
Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing
venenatis arcu.</p>
</div>
</div>
<script type="text/javascript">
function setupSwitches(){
//we define two arrays, containing our switches and divs.
var switchlinks = $$(''a.switch'');
var stretchdivs = $$(''.stretcher'');
alert(switchlinks);
alert(stretchdivs);
//then we create the effect.
switchlinks.each(function(elem){
elem.onClick = function()
{
// function actions here
}
});
}
Event.observe(window, ''load'', setupSwitches);
</script>
</body>
</html>
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---
Tom Gregory
2007-Jun-21 15:22 UTC
Re: Problem with accessing Dom objects if they are anchor tags
I''ll bet what you''re seeing is an implicit toString() implementation by the browser. You''re getting elements back, but it''s converting them output to hyperlinks when you alert(). TAG On Jun 21, 2007, at 9:15 AM, threethirdsfull-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org wrote:> > Hi I have a problem that I have never come across before while using > prototype... > > I am using this selector $$(''a.switch''), and I had expected and array > of DOM objects to be returned e.g. > [object HTMLAElement],[object HTMLAElement],[object HTMLAElement], > [object HTMLAElement] > > but what I get is and array that contains the href value of the a tags > e.g. > > http://www.domain.co.uk/page.html# > > Is this a bug or am I missing something... I have some more long > winded javascript that works but I wanted to use the new CSS selectors > > here is the code: > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" > "http:// > www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> > <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> > <head> > > <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> > <meta name="title" content="Expandable Div" /> > <meta name="robots" content="index, follow" /> > <meta name="description" content="checkbox" /> > <meta name="keywords" content="checkbox" /> > <meta name="language" content="en" /> > > <title>Expandable Div</title> > > <link rel="shortcut icon" href="/favicon.ico" /> > > <script type="text/javascript" src="js/prototype.js"></script> > <script type="text/javascript" src="js/scriptaculous.js"></script> > <link rel="stylesheet" type="text/css" media="screen" href="css/ > master.css" /> > > > </head> > <body> > <h1>Expandable Div Example</h1> > <div> > <a href="#" id="switch1" class="switch">Click to expand 1</a> > <div id="region1" class="stretcher" style="display: none"> > <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam > vehicula dapibus nibh. > Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet, > sapien enim fringilla velit, > sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse > platea dictumst. Nulla facilisi. > Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent > nulla nulla, posuere quis, > bibendum non, vestibulum sed, risus. Donec mollis hendrerit libero. > Fusce eleifend lacus non > augue. In venenatis turpis ac diam.</p> > <p>Nam feugiat, metus a ultricies dictum, diam nibh convallis est, > ut pellentesque ipsum dolor > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue. > Vestibulum nec magna. Fusce convallis. > Donec blandit. Morbi lobortis magna et nulla. Aenean varius lectus > id nisl. Nam vestibulum. > Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris. > Integer turpis. Vivamus ut > arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a, enim. > In gravida eros. > Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing > venenatis arcu.</p> > </div> > </div> > <div> > <a href="#" id="switch2" class="switch">Click to expand 2</a> > <div id="region2" class="stretcher" style="display: none"> > <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam > vehicula dapibus nibh. > Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet, > sapien enim fringilla velit, > sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse > platea dictumst. Nulla facilisi. > Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent > nulla nulla, posuere quis, > bibendum non, vestibulum sed, risus. Donec mollis hendrerit libero. > Fusce eleifend lacus non > augue. In venenatis turpis ac diam.</p> > <p>Nam feugiat, metus a ultricies dictum, diam nibh convallis est, > ut pellentesque ipsum dolor > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue. > Vestibulum nec magna. Fusce convallis. > Donec blandit. Morbi lobortis magna et nulla. Aenean varius lectus > id nisl. Nam vestibulum. > Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris. > Integer turpis. Vivamus ut > arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a, enim. > In gravida eros. > Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing > venenatis arcu.</p> > </div> > </div> > <div> > <a href="#" id="switch3" class="switch">Click to expand 3</a> > <div id="region3" class="stretcher" style="display: none"> > <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam > vehicula dapibus nibh. > Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet, > sapien enim fringilla velit, > sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse > platea dictumst. Nulla facilisi. > Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent > nulla nulla, posuere quis, > bibendum non, vestibulum sed, risus. Donec mollis hendrerit libero. > Fusce eleifend lacus non > augue. In venenatis turpis ac diam.</p> > <p>Nam feugiat, metus a ultricies dictum, diam nibh convallis est, > ut pellentesque ipsum dolor > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue. > Vestibulum nec magna. Fusce convallis. > Donec blandit. Morbi lobortis magna et nulla. Aenean varius lectus > id nisl. Nam vestibulum. > Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris. > Integer turpis. Vivamus ut > arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a, enim. > In gravida eros. > Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing > venenatis arcu.</p> > </div> > </div> > <script type="text/javascript"> > > function setupSwitches(){ > //we define two arrays, containing our switches and divs. > var switchlinks = $$(''a.switch''); > var stretchdivs = $$(''.stretcher''); > alert(switchlinks); > alert(stretchdivs); > > //then we create the effect. > switchlinks.each(function(elem){ > elem.onClick = function() > { > // function actions here > } > }); > } > > Event.observe(window, ''load'', setupSwitches); > > > </script> > </body> > </html> > > > >--~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
threethirdsfull-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org
2007-Jun-21 15:30 UTC
Re: Problem with accessing Dom objects if they are anchor tags
On Jun 21, 4:22 pm, Tom Gregory <t...-PGZyUNKar/Q@public.gmane.org> wrote:> I''ll bet what you''re seeing is an implicit toString() implementation > by the browser. You''re getting elements back, but it''s converting > them output to hyperlinks when you alert().I thought that but if a test the value more explicitly in the iteration loop by outputting the type of the DOM object I get an undefined output or at least a NULL value. unction setupSwitches(){ //we define two arrays, containing our switches and divs. var switchlinks = $$(''a.switcher''); var stretchdivs = $$(''.stretcher''); alert(switchlinks); alert(stretchdivs); //then we create the effect. switchlinks.each(function(s){ alert(s.type); // This alert has not output at all it is NULL s.onClick = function() { // function actions here } }); }> TAG > > On Jun 21, 2007, at 9:15 AM, threethirdsf...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org wrote: > > > > > Hi I have a problem that I have never come across before while using > > prototype... > > > I am using this selector $$(''a.switch''), and I had expected and array > > of DOM objects to be returned e.g. > > [object HTMLAElement],[object HTMLAElement],[object HTMLAElement], > > [object HTMLAElement] > > > but what I get is and array that contains the href value of the a tags > > e.g. > > >http://www.domain.co.uk/page.html# > > > Is this a bug or am I missing something... I have some more long > > winded javascript that works but I wanted to use the new CSS selectors > > > here is the code: > > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" > > "http:// > >www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> > > <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> > > <head> > > > <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> > > <meta name="title" content="Expandable Div" /> > > <meta name="robots" content="index, follow" /> > > <meta name="description" content="checkbox" /> > > <meta name="keywords" content="checkbox" /> > > <meta name="language" content="en" /> > > > <title>Expandable Div</title> > > > <link rel="shortcut icon" href="/favicon.ico" /> > > > <script type="text/javascript" src="js/prototype.js"></script> > > <script type="text/javascript" src="js/scriptaculous.js"></script> > > <link rel="stylesheet" type="text/css" media="screen" href="css/ > > master.css" /> > > > </head> > > <body> > > <h1>Expandable Div Example</h1> > > <div> > > <a href="#" id="switch1" class="switch">Click to expand 1</a> > > <div id="region1" class="stretcher" style="display: none"> > > <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam > > vehicula dapibus nibh. > > Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet, > > sapien enim fringilla velit, > > sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse > > platea dictumst. Nulla facilisi. > > Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent > > nulla nulla, posuere quis, > > bibendum non, vestibulum sed, risus. Donec mollis hendrerit libero. > > Fusce eleifend lacus non > > augue. In venenatis turpis ac diam.</p> > > <p>Nam feugiat, metus a ultricies dictum, diam nibh convallis est, > > ut pellentesque ipsum dolor > > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue. > > Vestibulum nec magna. Fusce convallis. > > Donec blandit. Morbi lobortis magna et nulla. Aenean varius lectus > > id nisl. Nam vestibulum. > > Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris. > > Integer turpis. Vivamus ut > > arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a, enim. > > In gravida eros. > > Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing > > venenatis arcu.</p> > > </div> > > </div> > > <div> > > <a href="#" id="switch2" class="switch">Click to expand 2</a> > > <div id="region2" class="stretcher" style="display: none"> > > <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam > > vehicula dapibus nibh. > > Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet, > > sapien enim fringilla velit, > > sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse > > platea dictumst. Nulla facilisi. > > Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent > > nulla nulla, posuere quis, > > bibendum non, vestibulum sed, risus. Donec mollis hendrerit libero. > > Fusce eleifend lacus non > > augue. In venenatis turpis ac diam.</p> > > <p>Nam feugiat, metus a ultricies dictum, diam nibh convallis est, > > ut pellentesque ipsum dolor > > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue. > > Vestibulum nec magna. Fusce convallis. > > Donec blandit. Morbi lobortis magna et nulla. Aenean varius lectus > > id nisl. Nam vestibulum. > > Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris. > > Integer turpis. Vivamus ut > > arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a, enim. > > In gravida eros. > > Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing > > venenatis arcu.</p> > > </div> > > </div> > > <div> > > <a href="#" id="switch3" class="switch">Click to expand 3</a> > > <div id="region3" class="stretcher" style="display: none"> > > <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam > > vehicula dapibus nibh. > > Sed eget nulla. Vestibulum mollis, pede quis iaculis imperdiet, > > sapien enim fringilla velit, > > sed pulvinar leo risus eget eros. Etiam pede. In hac habitasse > > platea dictumst. Nulla facilisi. > > Fusce consequat eros sit amet nisl sollicitudin pretium. Praesent > > nulla nulla, posuere quis, > > bibendum non, vestibulum sed, risus. Donec mollis hendrerit libero. > > Fusce eleifend lacus non > > augue. In venenatis turpis ac diam.</p> > > <p>Nam feugiat, metus a ultricies dictum, diam nibh convallis est, > > ut pellentesque ipsum dolor > > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut augue. > > Vestibulum nec magna. Fusce convallis. > > Donec blandit. Morbi lobortis magna et nulla. Aenean varius lectus > > id nisl. Nam vestibulum. > > Cras diam dui, auctor eget, mollis nec, volutpat egestas, mauris. > > Integer turpis. Vivamus ut > > arcu. Sed libero tortor, dapibus id, blandit at, pulvinar a, enim. > > In gravida eros. > > Proin malesuada urna ac massa. Cras vulputate. Ut adipiscing > > venenatis arcu.</p> > > </div> > > </div> > > <script type="text/javascript"> > > > function setupSwitches(){ > > //we define two arrays, containing our switches and divs. > > var switchlinks = $$(''a.switch''); > > var stretchdivs = $$(''.stretcher''); > > alert(switchlinks); > > alert(stretchdivs); > > > //then we create the effect. > > switchlinks.each(function(elem){ > > elem.onClick = function() > > { > > // function actions here > > } > > }); > > } > > > Event.observe(window, ''load'', setupSwitches); > > > </script> > > </body> > > </html>--~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
Tom Gregory
2007-Jun-21 15:36 UTC
Re: Problem with accessing Dom objects if they are anchor tags
The DOM property is element.nodeType, not element.type. http://developer.mozilla.org/en/docs/DOM:element.nodeType TAG On Jun 21, 2007, at 9:30 AM, threethirdsfull-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org wrote:> On Jun 21, 4:22 pm, Tom Gregory <t...-PGZyUNKar/Q@public.gmane.org> wrote: >> I''ll bet what you''re seeing is an implicit toString() implementation >> by the browser. You''re getting elements back, but it''s converting >> them output to hyperlinks when you alert(). > > I thought that but if a test the value more explicitly in the > iteration loop by outputting the type of the DOM object I get an > undefined output or at least a NULL value. > > unction setupSwitches(){ > //we define two arrays, containing our switches and divs. > var switchlinks = $$(''a.switcher''); > var stretchdivs = $$(''.stretcher''); > alert(switchlinks); > alert(stretchdivs); > > //then we create the effect. > switchlinks.each(function(s){ > alert(s.type); // This alert has not output at all it is NULL > s.onClick = function() > { > // function actions here > } > }); > }--~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---
threethirdsfull-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org
2007-Jun-21 15:44 UTC
Re: Problem with accessing Dom objects if they are anchor tags
I get the same result if I use the following more simple method:
var switchlinks = document.getElementsByClassName(''switcher'');
I have never seen this problem before... I can only think that the
HTML is incorrectly formatted... This is only meant to be a five
minute example to show another developer and the creative team... I''ve
looked at this for nearly an hour and got no where...
On Jun 21, 4:30 pm,
"threethirdsf...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org"
<threethirdsf...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org>
wrote:> On Jun 21, 4:22 pm, Tom Gregory <t...-PGZyUNKar/Q@public.gmane.org>
wrote:> I''ll bet what you''re seeing is an implicit
toString() implementation
> > by the browser. You''re getting elements back, but
it''s converting
> > them output to hyperlinks when you alert().
>
> I thought that but if a test the value more explicitly in the
> iteration loop by outputting the type of the DOM object I get an
> undefined output or at least a NULL value.
>
> unction setupSwitches(){
> //we define two arrays, containing our switches and divs.
> var switchlinks = $$(''a.switcher'');
> var stretchdivs = $$(''.stretcher'');
> alert(switchlinks);
> alert(stretchdivs);
>
> //then we create the effect.
> switchlinks.each(function(s){
> alert(s.type); // This alert has not output at all it is
NULL
> s.onClick = function()
> {
> // function actions here
> }
> });
>
> }
> > TAG
>
> > On Jun 21, 2007, at 9:15 AM,
threethirdsf...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org wrote:
>
> > > Hi I have a problem that I have never come across before while
using
> > > prototype...
>
> > > I am using this selector $$(''a.switch''), and I
had expected and array
> > > of DOM objects to be returned e.g.
> > > [object HTMLAElement],[object HTMLAElement],[object
HTMLAElement],
> > > [object HTMLAElement]
>
> > > but what I get is and array that contains the href value of the a
tags
> > > e.g.
>
> > >http://www.domain.co.uk/page.html#
>
> > > Is this a bug or am I missing something... I have some more long
> > > winded javascript that works but I wanted to use the new CSS
selectors
>
> > > here is the code:
>
> > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
> > > "http://
> > >www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
> > > <html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="en" lang="en">
> > > <head>
>
> > > <meta http-equiv="Content-Type"
content="text/html; charset=utf-8" />
> > > <meta name="title" content="Expandable
Div" />
> > > <meta name="robots" content="index,
follow" />
> > > <meta name="description"
content="checkbox" />
> > > <meta name="keywords" content="checkbox"
/>
> > > <meta name="language" content="en" />
>
> > > <title>Expandable Div</title>
>
> > > <link rel="shortcut icon"
href="/favicon.ico" />
>
> > > <script type="text/javascript"
src="js/prototype.js"></script>
> > > <script type="text/javascript"
src="js/scriptaculous.js"></script>
> > > <link rel="stylesheet" type="text/css"
media="screen" href="css/
> > > master.css" />
>
> > > </head>
> > > <body>
> > > <h1>Expandable Div Example</h1>
> > > <div>
> > > <a href="#" id="switch1"
class="switch">Click to expand 1</a>
> > > <div id="region1" class="stretcher"
style="display: none">
> > > <p>Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Nam
> > > vehicula dapibus nibh.
> > > Sed eget nulla. Vestibulum mollis, pede quis iaculis
imperdiet,
> > > sapien enim fringilla velit,
> > > sed pulvinar leo risus eget eros. Etiam pede. In hac
habitasse
> > > platea dictumst. Nulla facilisi.
> > > Fusce consequat eros sit amet nisl sollicitudin
pretium. Praesent
> > > nulla nulla, posuere quis,
> > > bibendum non, vestibulum sed, risus. Donec mollis
hendrerit libero.
> > > Fusce eleifend lacus non
> > > augue. In venenatis turpis ac diam.</p>
> > > <p>Nam feugiat, metus a ultricies dictum, diam
nibh convallis est,
> > > ut pellentesque ipsum dolor
> > > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut
augue.
> > > Vestibulum nec magna. Fusce convallis.
> > > Donec blandit. Morbi lobortis magna et nulla. Aenean
varius lectus
> > > id nisl. Nam vestibulum.
> > > Cras diam dui, auctor eget, mollis nec, volutpat
egestas, mauris.
> > > Integer turpis. Vivamus ut
> > > arcu. Sed libero tortor, dapibus id, blandit at,
pulvinar a, enim.
> > > In gravida eros.
> > > Proin malesuada urna ac massa. Cras vulputate. Ut
adipiscing
> > > venenatis arcu.</p>
> > > </div>
> > > </div>
> > > <div>
> > > <a href="#" id="switch2"
class="switch">Click to expand 2</a>
> > > <div id="region2" class="stretcher"
style="display: none">
> > > <p>Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Nam
> > > vehicula dapibus nibh.
> > > Sed eget nulla. Vestibulum mollis, pede quis iaculis
imperdiet,
> > > sapien enim fringilla velit,
> > > sed pulvinar leo risus eget eros. Etiam pede. In hac
habitasse
> > > platea dictumst. Nulla facilisi.
> > > Fusce consequat eros sit amet nisl sollicitudin
pretium. Praesent
> > > nulla nulla, posuere quis,
> > > bibendum non, vestibulum sed, risus. Donec mollis
hendrerit libero.
> > > Fusce eleifend lacus non
> > > augue. In venenatis turpis ac diam.</p>
> > > <p>Nam feugiat, metus a ultricies dictum, diam
nibh convallis est,
> > > ut pellentesque ipsum dolor
> > > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut
augue.
> > > Vestibulum nec magna. Fusce convallis.
> > > Donec blandit. Morbi lobortis magna et nulla. Aenean
varius lectus
> > > id nisl. Nam vestibulum.
> > > Cras diam dui, auctor eget, mollis nec, volutpat
egestas, mauris.
> > > Integer turpis. Vivamus ut
> > > arcu. Sed libero tortor, dapibus id, blandit at,
pulvinar a, enim.
> > > In gravida eros.
> > > Proin malesuada urna ac massa. Cras vulputate. Ut
adipiscing
> > > venenatis arcu.</p>
> > > </div>
> > > </div>
> > > <div>
> > > <a href="#" id="switch3"
class="switch">Click to expand 3</a>
> > > <div id="region3" class="stretcher"
style="display: none">
> > > <p>Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Nam
> > > vehicula dapibus nibh.
> > > Sed eget nulla. Vestibulum mollis, pede quis iaculis
imperdiet,
> > > sapien enim fringilla velit,
> > > sed pulvinar leo risus eget eros. Etiam pede. In hac
habitasse
> > > platea dictumst. Nulla facilisi.
> > > Fusce consequat eros sit amet nisl sollicitudin
pretium. Praesent
> > > nulla nulla, posuere quis,
> > > bibendum non, vestibulum sed, risus. Donec mollis
hendrerit libero.
> > > Fusce eleifend lacus non
> > > augue. In venenatis turpis ac diam.</p>
> > > <p>Nam feugiat, metus a ultricies dictum, diam
nibh convallis est,
> > > ut pellentesque ipsum dolor
> > > placerat lorem. Nulla laoreet nulla ut orci. Nunc ut
augue.
> > > Vestibulum nec magna. Fusce convallis.
> > > Donec blandit. Morbi lobortis magna et nulla. Aenean
varius lectus
> > > id nisl. Nam vestibulum.
> > > Cras diam dui, auctor eget, mollis nec, volutpat
egestas, mauris.
> > > Integer turpis. Vivamus ut
> > > arcu. Sed libero tortor, dapibus id, blandit at,
pulvinar a, enim.
> > > In gravida eros.
> > > Proin malesuada urna ac massa. Cras vulputate. Ut
adipiscing
> > > venenatis arcu.</p>
> > > </div>
> > > </div>
> > > <script type="text/javascript">
>
> > > function setupSwitches(){
> > > //we define two arrays, containing our switches and divs.
> > > var switchlinks = $$(''a.switch'');
> > > var stretchdivs = $$(''.stretcher'');
> > > alert(switchlinks);
> > > alert(stretchdivs);
>
> > > //then we create the effect.
> > > switchlinks.each(function(elem){
> > > elem.onClick = function()
> > > {
> > > // function actions here
> > > }
> > > });
> > > }
>
> > > Event.observe(window, ''load'', setupSwitches);
>
> > > </script>
> > > </body>
> > > </html>
--~--~---------~--~----~------------~-------~--~----~
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
-~----------~----~----~----~------~----~------~--~---
threethirdsfull-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org
2007-Jun-21 15:52 UTC
Re: Problem with accessing Dom objects if they are anchor tags
Thank you for pointing out the dumb error on my part.... I have spent too long rushing that now I think I''m past being productive.. Thanks again Ali On Jun 21, 4:36 pm, Tom Gregory <t...-PGZyUNKar/Q@public.gmane.org> wrote:> The DOM property is element.nodeType, not element.type.http://developer.mozilla.org/en/docs/DOM:element.nodeType > > TAG > > On Jun 21, 2007, at 9:30 AM, threethirdsf...-gM/Ye1E23mwN+BqQ9rBEUg@public.gmane.org wrote: > > > On Jun 21, 4:22 pm, Tom Gregory <t...-PGZyUNKar/Q@public.gmane.org> wrote: > >> I''ll bet what you''re seeing is an implicit toString() implementation > >> by the browser. You''re getting elements back, but it''s converting > >> them output to hyperlinks when you alert(). > > > I thought that but if a test the value more explicitly in the > > iteration loop by outputting the type of the DOM object I get an > > undefined output or at least a NULL value. > > > unction setupSwitches(){ > > //we define two arrays, containing our switches and divs. > > var switchlinks = $$(''a.switcher''); > > var stretchdivs = $$(''.stretcher''); > > alert(switchlinks); > > alert(stretchdivs); > > > //then we create the effect. > > switchlinks.each(function(s){ > > alert(s.type); // This alert has not output at all it is NULL > > s.onClick = function() > > { > > // function actions here > > } > > }); > > }--~--~---------~--~----~------------~-------~--~----~ 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 -~----------~----~----~----~------~----~------~--~---