This is probably too obvious to be right but if you're simply looking for all of the paragraph tags at that level could you simply go up to the parent and select down from there?
On Feb 22, 12:57 pm, Paul Kim <[email protected]> wrote: > Hi Alex, thanks for the tip. I've modified the function based on your tip > and your example function: > > function consecutiveSameTagSiblings(element) { > var element = $(element); > var nextSiblings = element.nextSiblings(); > var similarElements = []; > similarElements.push(element); > for (var i=0; i< nextSiblings.length; i++) { > if (element.tagName == nextSiblings[i].tagName) { > similarElements.push(nextSiblings[i]); > } > else { > break; > } > } > return similarElements; > } > > On Mon, Feb 22, 2010 at 9:50 AM, Alex Wallace <[email protected]>wrote: > > > > > Paul, one recommendation: store the results of element.nextSiblings() in a > > local variable outside of the loop. DOM traversals are pretty slow. > > > Best, > > Alex > > > On Mon, Feb 22, 2010 at 12:28 PM, Paul Kim <[email protected]> wrote: > > >> Hi Walter, if you want to get all similar elements up to but not including > >> the next head, I would use Prototype's Element.nextSiblings() to loop > >> through all elements with the same tagName and break when the tagName is > >> different. Here is a function I created just now that would hopefully do > >> what you want: > > >> function getSimilarElements(element) { > >> var element = $(element); > >> var similarElements = new Array(); > >> for (var i=0; i< element.nextSiblings().length; i++) { > >> if (element.tagName == element.nextSiblings()[i].tagName) { > >> similarElements[i] = element.nextSiblings()[i]; > >> } > >> else { > >> break; > >> } > >> } > >> return similarElements; > >> } > > >> Here is the entire example as well: > > >> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" > >> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> > >> <html xmlns="http://www.w3.org/1999/xhtml"> > >> <head> > >> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> > >> <title>Demo</title> > >> <script type="text/javascript" src=" > >>http://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js > >> "></script> > >> <script type="text/javascript" src=" > >>http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.3/scriptaculou... > >> "></script> > >> <script type="text/javascript"> > >> document.observe("dom:loaded", function() { > >> function getSimilarElements(element) { > >> var element = $(element); > >> var similarElements = new Array(); > >> for (var i=0; i< element.nextSiblings().length; i++) { > >> if (element.tagName == element.nextSiblings()[i].tagName) { > >> similarElements[i] = element.nextSiblings()[i]; > >> } > >> else { > >> break; > >> } > >> } > >> return similarElements; > >> } > > >> console.log(getSimilarElements('foo')); > >> }); > >> </script> > >> <style type="text/css"> > >> body {margin:0; padding:0;} > >> </style> > >> </head> > >> <body> > >> <div> > >> <h3>first header</h3> > >> <p id="foo">first paragraph</p> > >> <p>second paragraph</p> > >> <h3>second header</h3> > >> <p>third paragraph</p> > >> <p>fourth paragraph</p> > >> <p>fifth paragraph</p> > >> <h3>third header</h3> > >> <p>sixth paragraph</p> > >> <p>seventh paragraph</p> > >> </div> > >> </body> > >> </html> > > >> On Mon, Feb 22, 2010 at 8:22 AM, Walter Lee Davis > >> <[email protected]>wrote: > > >>> Thanks very much. I was looking in the wrong place for the functionality > >>> I need. You've given me the bones I need to build on. > > >>> Walter > > >>> On Feb 22, 2010, at 11:07 AM, Alex Wallace wrote: > > >>> I whipped up something that should handle the task, although I'm sure > >>>> this could be optimized using the nextElementSibling. This version grabs > >>>> nextSiblings() and then filters them, but the faster way would be to > >>>> iterate > >>>> over the `element.nextSibling` and break when it encounters a different > >>>> tag > >>>> name (instead of finding them all, which is bound to be slower). > > >>>> But here goes: > > >>>> function consecutiveSameTagSiblings(element) { > >>>> element = $(element); > >>>> var siblings = element.nextSiblings(), results = []; > >>>> if (!siblings[0]) return results; > >>>> var tagName = siblings[0].tagName.toLowerCase(); > >>>> for (var i = 0, sibling; sibling = siblings[i]; ++i) { > >>>> if (sibling.tagName.toLowerCase() === tagName) > >>>> results.push(sibling); > >>>> else > >>>> break; > >>>> } > >>>> return results; > >>>> } > > >>>> Best, > >>>> Alex > > >>>> On Mon, Feb 22, 2010 at 10:38 AM, Walter Lee Davis <[email protected]> > >>>> wrote: > >>>> Hmmm. That's not a documented function. I had a look at the source, and > >>>> I can't see how it works. It accepts a node as its only argument, and it > >>>> doesn't seem to perform any comparison as it executes. How then would I > >>>> get > >>>> it to stick to just the one type of sibling, and how would I get it to > >>>> stop > >>>> when it ran out of similar siblings? > > >>>> Thanks as always for any pointers. > > >>>> Walter > > >>>> On Feb 22, 2010, at 10:29 AM, Alex Wallace wrote: > > >>>> You'll want to leverage Prototype's nextElementSibling function. That > >>>> function grabs element.nextSibling and traverses until it finds an an > >>>> actual > >>>> element (by checking nodeType). > > >>>> You could wrap a function around that which stores the tagName of the > >>>> first element it matches, and then continues to find nextElementSibling > >>>> until it either returns null, or break when the tagName doesn't match the > >>>> original tagName. > > >>>> Take a look at the innards of Element.adjacent and > >>>> Element.nextElementSibling for an idea of what I mean. > > >>>> Best, > >>>> Alex > > >>>> On Mon, Feb 22, 2010 at 12:00 AM, Walter Lee Davis <[email protected]> > >>>> wrote: > >>>> I have a structure like this inside a parent DIV: > > >>>> H3 > >>>> P > >>>> P > >>>> H3 > >>>> P > >>>> P > >>>> P > >>>> H3 > >>>> P > >>>> P > > >>>> And I'd like to be able to get the paragraphs between two heads, or > >>>> between the last head and the end of the parent DIV. > >>>> Element.adjacent('p') > >>>> doesn't do what I need -- it returns all the p tags in the entire DIV, > >>>> since > >>>> everything is at the same level. If I get a reference to the first > >>>> element > >>>> following the head, how could I get all similar elements up to but not > >>>> including the next head? I'm trying to find a purely structure based way > >>>> to > >>>> do this, rather than adding classnames to the elements. > > >>>> Thanks, > > >>>> Walter > > >>>> -- > >>>> You received this message because you are subscribed to the Google > >>>> Groups "Prototype & script.aculo.us" group. > >>>> To post to this group, send email to > >>>> [email protected]. > >>>> To unsubscribe from this group, send email to > >>>> [email protected]<prototype-scriptaculou > >>>> s%[email protected]> > >>>> . > >>>> For more options, visit this group at > >>>>http://groups.google.com/group/prototype-scriptaculous?hl=en. > > >>>> -- > >>>> You received this message because you are subscribed to the Google > >>>> Groups "Prototype & script.aculo.us" group. > >>>> To post to this group, send email to > >>>> [email protected]. > >>>> To unsubscribe from this group, send email to > >>>> [email protected]<prototype-scriptaculou > >>>> s%[email protected]> > >>>> . > >>>> For more options, visit this group at > >>>>http://groups.google.com/group/prototype-scriptaculous?hl=en. > > >>>> -- > >>>> You received this message because you are subscribed to the Google > >>>> Groups "Prototype & script.aculo.us" group. > >>>> To post to this group, send email to > >>>> [email protected]. > >>>> To unsubscribe from this group, send email to > >>>> [email protected]<prototype-scriptaculou > >>>> s%[email protected]> > >>>> . > >>>> For more options, visit this group at > >>>>http://groups.google.com/group/prototype-scriptaculous?hl=en. > > >>>> -- > >>>> You received this message because you are subscribed to the Google > >>>> Groups "Prototype & script.aculo.us" group. > >>>> To post to this group, send email to > >>>> [email protected]. > >>>> To unsubscribe from this group, send email to > >>>> [email protected]<prototype-scriptaculou > >>>> s%[email protected]> > >>>> . > >>>> For more options, visit this group at > >>>>http://groups.google.com/group/prototype-scriptaculous?hl=en. > > >>> -- > >>> You received this message because you are subscribed to the Google Groups > >>> "Prototype & script.aculo.us" group. > >>> To post to this group, send email to > >>> [email protected]. > >>> To unsubscribe from this group, send email to > >>> [email protected]<prototype-scriptaculou > >>> s%[email protected]> > >>> . > >>> For more options, visit this group at > >>>http://groups.google.com/group/prototype-scriptaculous?hl=en. > > >> -- > >> You received this message because you are subscribed to the Google Groups > >> "Prototype & script.aculo.us" group. > >> To post to this group, send email to > >> [email protected]. > >> To unsubscribe from this group, send email to > >> [email protected]<prototype-scriptaculou > >> s%[email protected]> > >> . > >> For more options, visit this group at > >>http://groups.google.com/group/prototype-scriptaculous?hl=en. > > > -- > > You received this message because you are subscribed to the Google Groups > > "Prototype & script.aculo.us" group. > > To post to this group, send email to > > [email protected]. > > To unsubscribe from this group, send email to > > ... > > read more » -- You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
