Tuesday, September 29, 2009

[jQuery] Trying to match just the first descendent in each tree of descendents

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&hellip;</p>
<img src="test.png" widget="image" />
</div>

<div widget="repeat">
<h3 widget="line">Section Title</h3>
<p widget="textarea">Content&hellip;</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

No comments: