jquery: enfants () vs sélecteur d'enfant ">"
j'ai une table qui a une section semblable à la suivante:
<tr>
<td> <span class="myclass"></span>
</td>
<tr>
mon $(ceci) est défini à l'élément tr et j'essaie d'accéder aux éléments de portée qui ont la classe "myclass" définie. La suite semble fonctionner:
if ($(this).children('td').children('span').is('.myclass')){
alert('in here');
}
mais lorsque vous essayez d'utiliser ceci:
if ($(this).children("td > span").is('.myclass')){
ou:
if ($(this).children("td span").is('.myclass')){
Il ne fonctionne pas. J'ai pensé que l'un ou l'autre des deux ci-dessus donnerait des résultats similaires (bien que par des méthodes différentes) mais apparemment pas.
Qu'est-ce que je rate ici?
Merci!
3 réponses
children(selector) ne correspondent à ceux des enfants qui correspondent à selector. Aucun d' tr's d'enfants (tds) peut correspondre td > span, comme tr n'a pas de span éléments pour enfants, seulement tdet td > span !== td.
documentation est également assez clair à ce sujet:
Obtenir les enfants de chaque élément dans l'ensemble d'éléments qui correspondent, éventuellement filtrées par un sélecteur.
ce que vous pourriez vouloir au lieu de cela .find():
$(this).find("td > span")
retourne tous les descendants, et pas seulement les enfants, qui correspondent au sélecteur.
dans le jQuery docs:
"Le .find() et .les méthodes des enfants() sont similaires, sauf que ces derniers ne parcourent qu'un seul niveau le long du DOM tree."
je recommande d'utiliser ceci:
if ($(this).find('.myclass').length){
alert('in here');
}
Cheers
je l'ai expliqué ce ici.
la différence est que le premier sélecteur est entièrement dans le children appel, tandis que le second ne l'est pas.
par conséquent, le premier cherche tous les enfants de this qui correspondent aussi td > span. (En d'autres termes, tous { <span>s les enfants de <td> s } (le sélecteur) qui sont eux-mêmes directement les enfants de this)
le second trouvera tout <td> enfants de , puis trouver tous les <span>dans les <td> S.