Actually, it looks a little more complicated than that. Since the OP
isn't using classes, ".widget" isn't going to work.
Andrew, I'm a little surprised your initial selector -- $
('[widget]:not([widget] [widget])') -- is working correctly. I'd
probably do it a little differently:
$('div[widget]').filter(function() {
return !$(this).parents([widget]).length;
})
// then you can loop through each of those top-level widgets
// and find their direct-child widgets...
.each(function(index) {
$(this).children('[widget]') // and do something with them here
});
If you want to do something en-masse to all child widgets of top-level
widgets, you don't need the .each():
$('div[widget]').filter(function() {
return !$(this).parents([widget]).length;
}).children('[widget') // and do something with them here
I added 'div' to the initial selector, since it looks like all of your
top-level widgets are divs. It's going to be quite a bit faster if you
limit the selector to a specific tag name rather than inspecting every
single element for a particular attribute.
Let me know if this doesn't work or if I misunderstood what you wanted.
--Karl
____________
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Sep 30, 2009, at 11:57 PM, Charlie wrote:
$(".widget > .widget") // stops at first desendant
$(".widget .widget : first") //might work too, haven't tried it
Andrew Ingram wrote:
Apologies for the subject line, I'm struggling to explain the problem
in a concise manner.
I have the following document:
<body>
<h1 class="page-editable" widget="line">Page Title Goes
Here</h1>
<div widget="repeat-area">
<div widget="repeat">
<h2 widget="line">Section Heading</h2>
<div widget="repeat-area">
<div widget="repeat">
<h3 widget="line">Section
Title</h3>
<p
widget="textarea">Content…</p>
<img src="test.png" widget="image"
/>
</div>
<div widget="repeat">
<h3 widget="line">Section
Title</h3>
<p
widget="textarea">Content…</p>
<img src="test.png" widget="image"
/>
</div>
</div>
</div>
</div>
</body>
I am trying to recursively access each element with the attribute
'widget'. The first level of recursion is easy:
$('[widget]:not([widget] [widget])')
Which matches all widgets that are not descendants of other widgets,
ie the top level.
The problem is with the next recursive steps, I can't figure out how
to find just the first level of widgets that are a descendents of the
current node.
$('[widget]:not([widget] [widget])').each(function(i){
// For example, I need a query I'd put here to access the next
level of elements.
});
There is no guarantee that the widgets would be direct children of
each other, or that they'd be on the same tree level as their
'sibling' widgets.
Basically I need a way of finding all widgets that are descendents of
the current working node, but with no other widgets in-between.
If anything needs clarifying let me know.
Regards,
Andrew Ingram
