The heads and the paragraphs are all at the same level, and I don't
want all the paragraphs, just the ones between "this" head and the
next head. (It's for an accordion effect.) So while
up('div').select('p') would do exactly what you say, it would leave me
where I started.
Thanks,
Walter
On Feb 22, 2010, at 5:46 PM, Matt Foster wrote:
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
.
--
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.
