CODEWITHSUNDEEP
javascriptjqueryjquery-selectors
Dem Pilafian
Dem Pilafian

Reputation: 5976

jQuery selector that excludes a subtree of the DOM

Is there a jQuery selector that will grab all elements of class A that are not descendants of class B?

Example:

<body>
   <div class=report-value id=overview></div>
   <div class=panels>
      <div class=report-value id=sales></div>
      <div class=report-value id=training></div>
      <div class=report-value id=hr></div>
   </div>
   <div class=report-value id=summary></div>
</body>

For the above example, the need is to select all .report-value elements that are not descendants of the .panels element. The report values are computationally heavy and need to be calculated only when actually displayed.

Something like:

var elems = $('.report-value:excludeTree(.panels)');

which would return a jQuery object containing only #overview and #summary.

Performance is important for this web application.

Upvotes: 2

Views: 504

Answers (5)

Jain
Jain

Reputation: 1249

Try this:

$('.report-value').each(function(){
if(!$(this).parent().hasClass('panels') && !$(this).parents().eq(1).hasClass('panels'))
{
console.log($(this));
}
});

It console only ur required divs

Upvotes: 0

Jain
Jain

Reputation: 1249

$('body > .report-value')

or

$('.report-value').each(function(){
if(!$(this).parent().hasClass('.panels'))
{
//use query
}
});

Upvotes: 0

Mahesh Reddy
Mahesh Reddy

Reputation: 356

var allpanels=$('body>.report-value');

Upvotes: 0

Arun P Johny
Arun P Johny

Reputation: 388316

You can use .not() filter out those elements

$('.report-value').not('.panels .report-value')

Demo: Fiddle

Upvotes: 3

Rajaprabhu Aravindasamy
Rajaprabhu Aravindasamy

Reputation: 67197

Try,

var elems = $('.report-value').filter(function(){ 
                 return $(this).closest('.panels').length ==0; 
            });

DEMO

Upvotes: 1

Related Questions