CODEWITHSUNDEEP
javascriptjqueryjquery-selectors
Zwirbelbart
Zwirbelbart

Reputation: 827

Selector ignoring elements contained in a specific element

I am currently working on a software plugin which scans a page for links in order to edit them. But there is a problem: I dont want to edit links that are contained in a specific element (in this case: an edit box). The elements contained in this edit box can also be nested, so parent might not be appropriate.

Is there any way to exclude elements via selector that are contained in a specific element?

Upvotes: 0

Views: 63

Answers (2)

joseeight
joseeight

Reputation: 924

You can run this plain JavaScript, it returns all elements with the matching pattern not in the container you specify.

var anchors = document.querySelectorAll('*:not(.editBox)>a.link');

Assuming your not wanted container has a class of "editBox" and you can change the matching "link" class to be any query selector you want, can be a plain 'a' for all anchor elements. I created a JSFiddle as a demo.

Upvotes: 1

Lix
Lix

Reputation: 47956

This doesn't all have to be on one selector. You could very simply use your regular selector to catch all the elements, and then execute a not() function to trim down the elements to only those you need.

var elems = $( "a" ); // all anchor links
elems = elems.not( ".ignore_me" ); // remove all links with the "ignore_me" class.

You could even combine these two into one command using function chaining:

var elems = $( "a" ).not( ".ignore_me" );

A third option that I feel is a little less readable would be something like this:

var elems = $( "a:not( .ignore_me )" );

References:

Upvotes: 0

Related Questions