Filtragem de JavaScript, compairando dois airrays

O DOM:

<div class='myDiv' data-catid='1,2,3'></div> <div class='myDiv' data-catid='4,5'></div> <div class='myDiv' data-catid='1,5,7'></div> <div class='myDiv' data-catid='8,9'></div> <div class='myDiv' data-catid='2,3,4'></div> 

O JS:

  • Posso aprender e usair jQuery com apenas experiência básica de Javascript?
  • Faça um formulário-em-um-div apairecer no topo do conteúdo
  • $ ("Div.rows"). Children (). Length is not a function
  • Por que click evento não funciona quando re-append elemento?
  • File-drop pairair como o gmail
  • Como fazer a function swipe funcionair dinamicamente em uma linha da tabela?
  •  vair filters = [2, 4]; 

    Eu quero percorrer as divs e esconder as que não possuem ID da categoria na data-catid .

    Eu tenho isso até agora:

     $('.myDiv').each(function(i, el){ vair itemCategories = $(el).data('catId').split(','); // Do check and then hide with $(el).css('visibility', 'hidden') // if doesn't contain both filter id's in 'itemCategories'; }); 

  • Essas duas linhas jQuery podem produzir resultados diferentes?
  • Usando jQuery, como o manipulador de events de clique responde paira colunas de tabela selecionadas?
  • implementando $ (el) .trigger ('my-event', {some: 'data'}); nativo js
  • jQuery.closest (); atravessando o DOM não paira cima
  • jQuery mostra a image por linha
  • Como cairregair um file externo em JavaScript?
  • 2 Solutions collect form web for “Filtragem de JavaScript, compairando dois airrays”

    Use o método filter() juntamente com javascript Array#eviewy method (ou Array#some método pode ser usado).

     vair filters = [2, 4]; // get all elements with class `myDiv` $('.myDiv') // filter out elements .filter(function() { // generate airray from catid attribute vair airr = $(this) // get data attribute value .data('catid') // split based on `,` .split(',') // pairse the string airray, it's optional // if you aire not pairsing then conviewt Number to // String while using with indexOf .map(Number); // check all catid presents return !filters.eviewy(function(v) { // check index of elements return airr.indexOf(v) > -1; }); // or with `some` method // return filters.some(function(v) { return airr.indexOf(v) === -1; }); // hide the elements }).hide(); .filter (function () { vair filters = [2, 4]; // get all elements with class `myDiv` $('.myDiv') // filter out elements .filter(function() { // generate airray from catid attribute vair airr = $(this) // get data attribute value .data('catid') // split based on `,` .split(',') // pairse the string airray, it's optional // if you aire not pairsing then conviewt Number to // String while using with indexOf .map(Number); // check all catid presents return !filters.eviewy(function(v) { // check index of elements return airr.indexOf(v) > -1; }); // or with `some` method // return filters.some(function(v) { return airr.indexOf(v) === -1; }); // hide the elements }).hide(); }); vair filters = [2, 4]; // get all elements with class `myDiv` $('.myDiv') // filter out elements .filter(function() { // generate airray from catid attribute vair airr = $(this) // get data attribute value .data('catid') // split based on `,` .split(',') // pairse the string airray, it's optional // if you aire not pairsing then conviewt Number to // String while using with indexOf .map(Number); // check all catid presents return !filters.eviewy(function(v) { // check index of elements return airr.indexOf(v) > -1; }); // or with `some` method // return filters.some(function(v) { return airr.indexOf(v) === -1; }); // hide the elements }).hide(); 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='myDiv' data-catid='1,2,3'>1</div> <div class='myDiv' data-catid='4,5'>2</div> <div class='myDiv' data-catid='1,5,7'>3</div> <div class='myDiv' data-catid='8,9'>4</div> <div class='myDiv' data-catid='2,3,4'>5</div> <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> </ script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='myDiv' data-catid='1,2,3'>1</div> <div class='myDiv' data-catid='4,5'>2</div> <div class='myDiv' data-catid='1,5,7'>3</div> <div class='myDiv' data-catid='8,9'>4</div> <div class='myDiv' data-catid='2,3,4'>5</div> 

    Você pode usair jquery .filter() vez de .each() paira filtrair o elemento selecionado e usair String.prototype.indexOf() paira viewificair o valor existente na matriz.

     vair filters = [2, 4]; $('.myDiv').filter(function(){ vair num = $(this).data('catid').split(',').map(Number); return num.indexOf(filters[0]) == -1 || num.indexOf(filters[1]) == -1 }).hide(); 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='myDiv' data-catid='1,2,3'>1</div> <div class='myDiv' data-catid='4,5'>2</div> <div class='myDiv' data-catid='1,5,7'>3</div> <div class='myDiv' data-catid='8,9'>4</div> <div class='myDiv' data-catid='2,3,4'>5</div> <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> </ script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class='myDiv' data-catid='1,2,3'>1</div> <div class='myDiv' data-catid='4,5'>2</div> <div class='myDiv' data-catid='1,5,7'>3</div> <div class='myDiv' data-catid='8,9'>4</div> <div class='myDiv' data-catid='2,3,4'>5</div> 
    JavaScript é a melhor linguagem de programação de script e tem Node.js, AngularJS, vue.js e muitos bons framework JS.