jquery exclude array elements

Question

I have an array of elements which I want to maintain efficiently, adding and removing arrays of elements over time.

var myElements = $('.initial');

jquery's merge() seems perfect for adding items as it doesn't create a new array and just adds to the existing one:

$.merge(myElements, $('.to-add'));

Is there an equivalent for removing, that also modifies the array in-place? Something like:

$.exclude(myElements, $('.to-remove'));

I do actually have arrays of DOM elements, and the selectors are just used as examples.

Can't you use splice()? developer.mozilla.org/en/docs/Web/JavaScript/Reference/… — adamj
– adamj, Commented Jan 12, 2016 at 3:51
@adamj it looks like splice can only remove a range of elements given by and index and length, whereas I want to remove elements from another array, which could exist anywhere and in any order. — jozxyqk
– jozxyqk, Commented Jan 12, 2016 at 3:53
@jozxyqk Note, passing jQuery() as parameter to $.exclude() would create a new object — guest271314
– guest271314, Commented Jan 12, 2016 at 19:17

Hee Jae Kim · Accepted Answer · 2016-01-12 09:49:50Z

2

Assuming that you're after the relative complement of b in a. And you don't want to create additional objects while process. The function is for both plain Array and jQuery set. (thus used $.each, $.inArray instead of Array.prototype.forEach Array.prototype.indexOf)

I wrote a function that fits your requirement.

$.exclude = function(a,b) {
    var idx;
    $.each(b, function(i, val) {
      while((idx = $.inArray(val, a)) !== -1) {
         a.splice(idx, 1);         
      }
    })
    return a;
}

test this code here https://jsfiddle.net/happyhj/uwd4L1dm/8/

and you can use like this.

$.exclude(myElements, $('.to-remove'));

edited Jan 12, 2016 at 9:49

answered Jan 12, 2016 at 5:58

Hee Jae Kim

1211 silver badge6 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

jozxyqk Over a year ago

Looks more like O(n * m) to me. You could replace one of the loops with indexOf, but the main point of using splice to remove elements in-place seems to be the way to go.

Hee Jae Kim Over a year ago

@jozxyqk jQuery set not have indexOf function. but that is good suggestion. I will use $.inArray().

Azad · Accepted Answer · 2016-01-12 04:04:41Z

1

use jquery not method,

var filtered = $(myElements).not($('.to-remove'));

answered Jan 12, 2016 at 4:04

Azad

5,2725 gold badges32 silver badges59 bronze badges

4 Comments

jozxyqk Over a year ago

although not in-place, that's pretty close to what I'm after. didn't realise not() could take an array, rather than a selector or element.

Azad Over a year ago

you can create own exclude function using not().

jozxyqk Over a year ago

my issue with in-place is for efficiency. every removal will leave an unused array for the garbage collector to deal with. as the array grows in size, this would start to slow things down.

jozxyqk Over a year ago

@charlietfl in my case I have an array, not a selector (was using that just for an example). azzi was correct to include it in this answer.

brk · Accepted Answer · 2016-01-12 04:42:54Z

You can use delete to remove an element from an array and then use $.grep to remove the empty space.

//[0] since $("#id") will be a jquery Object
//[0] will return the particular DOM element

var orgArray = [$("#merge1")[0],$("#merge2")[0],$("#merge3")[0]];
var secArray = [$("#merge4")[0],$("#merge5")[0]]

// Will merge other two values; 
// jQuery merge will merge contents of 
//two array into first array

var merArray = $.merge(secArray, orgArray);

// Want to remove $("#merge2");

var getIndex = merArray.indexOf($("#merge2")[0]);
    if(getIndex >-1){
     delete merArray[getIndex] 
    }

// length before filtering
$("#l1").text(merArray.length);

//Now will remove Empty Space

merArray = $.grep(merArray,function(n){
 return n==0 || n
});
$("#l2").text(merArray.length);

JSFIDDLE

charlietfl · Accepted Answer · 2016-01-12 04:55:25Z

0

You are using methods that are meant for array literals. jQuery already has method add() which will return a modified jQuery object that includes the elements matching the selector

var myElements = $('.initial');
var newCollection = myElements.add('.to-add');    
newCollection.not('.to-remove').doSomething();

Don't think of jQuery objects as arrays although they are array like.

Reference add()

It's not clear what your overall objective really is but most likely you can manage it with any number of filtering methods that already exist within the api

answered Jan 12, 2016 at 4:55

charlietfl

172k14 gold badges125 silver badges154 bronze badges

3 Comments

guest271314 Over a year ago

.not() creates a new jQuery object

charlietfl Over a year ago

@guest271314 not sure what relevance is. It won't change newCollection, just pass that new object to next method in chain

guest271314 Over a year ago

"the .not() method constructs a new jQuery object from a subset of the matching elements." api.jquery.com/not . Requirement appear to be not to create a new jQuery collection or array ?, only push to, or delete from newCollection ? Though at OP, not certain why, a new jQuery object is passed as parameter to $.exclude() ? and OP does not address this portion of js at Question directly ; could be incorrect, here, as to interpretation of requirement

Collectives™ on Stack Overflow

jquery exclude array elements

4 Answers 4

2 Comments

4 Comments

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

4 Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related