jquery, sélecteur de classe dans l'id

Question

Ci-dessous, comment dois-je sélectionner les éléments qui contiennent la classe my_class dans l'élément avec id = "my_id" ?

Notez que l'élément peut aussi avoir une autre classe, que je ne sélectionne pas.

<div id = "my_id">
    <span class = "my_class hidden">hi</span>
    <span class = "my_class">hello</span>
</div>

essayait

$("#my_id [class*=my_class ]")

Answer 1

Vous pouvez utiliser le sélecteur de classe ainsi que sélecteur de descendants

$("#my_id .my_class")

Answer 2

Utilisez simplement le sélecteur de classe.

$('#my_id .my_class')

Il importe peu que l'élément ait aussi d'autres classes. Il possède la classe .ma_classe et il se trouve quelque part dans la classe #my_id afin qu'il corresponde à ce sélecteur.

En ce qui concerne les performances

Selon le Documentation sur les performances des sélecteurs jQuery il est plus rapide d'utiliser les deux sélecteurs séparément, comme ceci :

$('#my_id').find('.my_class')

Voici la partie pertinente de la documentation :

Sélecteurs basés sur l'ID

// Fast:
$( "#container div.robotarm" );

// Super-fast:
$( "#container" ).find( "div.robotarm" );

En .find() est plus rapide car la première sélection est traitée sans passer par le moteur de sélection Sizzle - les sélections par ID uniquement sont traitées à l'aide de l'approche document.getElementById() qui est extrêmement rapide car il est intégré au navigateur.

Sélection de par ID o par classe seul (entre autres) invoque des fonctions fournies par le navigateur comme document.getElementById() qui sont assez rapides, alors que l'utilisation d'un sélecteur descendant invoque le moteur Sizzle comme mentionné qui, bien que rapide, est plus lent que l'alternative proposée.

Answer 3

Utilisez toujours

//Super Fast
$('#my_id').find('.my_class'); 

au lieu de

// Fast:
$('#my_id .my_class');

Regardez Règles de performance JQuery .

Également à Jquery Doc

Answer 4

Aussi $( "#container" ).find( "div.robotarm" );
est égal à : $( "div.robotarm", "#container" )

Answer 5

Je pense que vous demandez de sélectionner uniquement <span class = "my_class">hello</span> cet élément, vous devez faire comme ceci, si je comprends bien votre question c'est la réponse,

$("#my_id [class='my_class']").addClass('test');

<a href="http://jsfiddle.net/Fe5sf/" rel="nofollow">DEMO</a>