Trouver classname dynamique de l'élément avec jQuery

Question

Je vais avoir un nombre inconnu d'éléments comme ceci:

<div class="item item-1"></div> 
<div class="item item-2"></div> 
<div class="item item-3"></div> 

Ce que je veux faire, est de vérifier si chaque élément a un nom de classe commençant par « item- ». Si la valeur est true, extrayez l'identifiant. Quelque chose comme ceci:

$("container").each(function 
    if ($(this).hasClassNameStartingWith("item-")) 
     console.debug(theId); 
); 

Comment est-ce possible?

Merci d'avance!

Answer 1

Utilisez le sélecteur contient l'attribut de classe:

$('container[class*=" item-"]').each(function() { 
    var classID = null; 
    var classes = $(this).attr('class').split(' '); 
    for (var i = 0, len < classes.length; i < len; ++i) { 
     var class = classes[i]; 
     if (class.match(/^item-/)) { 
      classID = class.replace("item-",''); 
      break; 
     } 
    } 
    if (classID) { 
     ... do something ... 
    } 
}); 

Notez l'utilisation de citations pour inclure l'espace, compte tenu de votre marque échantillon vers le haut. Vous pourriez aussi omettre l'espace si la classe "item-N" pouvait apparaître au début de la liste et vous étiez sûr qu'il n'y avait aucune classe qui correspondrait accidentellement à cette chaîne.

Exemple mis à jour pour montrer comment extraire la partie identificateur du nom de classe.

Answer 2

Vous pouvez effectuer une correspondance d'expression régulière sur les éléments enfant attribut class:

var itemIDRe = /(?:^|[ \t\n\r\f\u200b]+)item-([^ \t\n\r\f\u200b]+)/; 

$('#container').children().each(function() { 
    var match = itemIDRe.exec($(this).attr('class')); 
    var itemID = match ? match[1] : null; 

    // Do something with itemID. 
}); 

L'expression régulière est basée sur la définition HTML 4 pour la class attribute et white space.