jQuery dostać pewnych klas, ale nie inne

Question

Mam div, który wygląda jak

<div class="draggable resizable abc table shadow"></div> 

Clases nie są w określonej kolejności. Jeśli wykonam $('div').attr('class'), otrzymam listę wszystkich klas dla tego div. Chcę tylko uzyskać klasy, które nie są resizable, , draggable lub table. W tym przypadku chcę abc shadow. Jak mam to zrobic.

Answer 1

var all = "draggable resizable abc table shadow"; 
var some = all.replace(/(?:^|\s)(resizable|draggable|table)(?=\s|$)/g, ''); 

console.log(some); 
// " abc shadow" 

console.log(some.replace(/^\s+|\s+$/g,'')); 
// "abc shadow" 

console.log(some.split(/\s+/)); 
// ["", "abc", "shadow"] 

Należy pamiętać, że nie trzeba drugi replace (nie trzeba zdejmować początkowe i końcowe spacje), jeżeli chcesz to ciąg znaków, który jest odpowiedni do ustawiania className do.

Ale wtedy, jeśli starasz się po prostu usunąć zestaw znanych klas od elementu, o wiele lepiej po prostu:

$(...).removeClass("draggable resizable table"); 

Alternatywny (bez konieczności regex):

var ignore = {resizable:1, draggable:1, table:1}; 
var all = "draggable resizable abc table shadow".split(' '); 
for (var subset=[],i=all.length;i--;) if (!ignore[all[i]]) subset.push(all[i]); 

console.log(subset); 
// ["shadow","abc"] 

console.log(subset.join(' ')); 
// "shadow abc" 

Answer 2

Możesz sprawdzić poszczególne zajęcia, używając .hasClass.

$("div").hasClass("class"); 

Answer 3

Ta odpowiedź została udzielona tutaj. Get class list for element with jQuery.

można rozszerzyć to po prostu za sznurki w tablicy, które nie są „skalowalny, przeciągany lub stół”

Answer 4

@Phrogz odpowiedź jest dobra. Wygląda na to, że jest kresem regex. Ponieważ nie wiem regex, że dobrze, tutaj jest moje zdanie na jej temat:

var aryClasses = $("div").attr("class").split(" "); 
var aryDesiredClasses = new Array(); 

for(var i = 0; i < aryClasses.length; i++) { 
    if(aryClasses[i] != "table" 
        && aryClasses[i] != "resizable" 
        && aryClasses[i] != "draggable") 
     aryDesiredClasses.push(aryClasses[i]); 
} 

alert(aryDesiredClasses.join(" ")); 

Oto a working fiddle to illustrate.

Answer 5

Wtyczka:

(function($) { 
    $.fn.getClasses = function(exclude) { 
     var remove = {}; 

     for(var i = exclude.length; i--;) { 
      remove[exclude[i]] = true; 
     } 

     return $.map(this.attr('class').split(/\s+/g), function(cls) { 
      return remove[cls] ? null : cls; 
     }); 
    }; 
}(jQuery)); 

Zastosowanie:

var classes = $('div').getClasses(['resizable', 'draggable', 'table']); 

Answer 6

 function getDesiredClass(removedClassArr){ 
      var classArray = $("selector").attr('class').split(" "); 
      var desiredClassArray = []; 
      for(var i = 0; i < classArray.length; i++){ 
       if (!isUnDesiredClass(removedClassArr, classArray[i])){ 
        desiredClassArray .push(classArray[i]); 
       } 
      } 
      return desiredClassArray; 
     } 
     function isUnDesiredClass(removedClassArr , cls){ 
     for(var i = 0; i < removedClassArr.length; i++){ 
      if(removedClassArr[i] == cls){ 
       return true; 
      } 
     } 
     return false; 
    } 

Answer 7

var classes = $('div').not('.resizable, .draggable, .table').attr('class').split(' '); 

Answer 8

przyjrzeć się tej jsFiddle, mam coś pracuje jak co chciałeś.

także rzucić okiem na jQuery :not selectors