Comment sélectionner le premier DIV parent en utilisant jQuery?

95 
var classes = $(this).attr('class').split(' '); // this gets the current element classes

var classes = $(this).parent().attr('class').split(' '); // this gets the parent classes.

Le parent dans la situation ci-dessus est un ankor.

Si je voulais obtenir le premier DIV parent de $ (this), à quoi ressemblerait le code?

var classes = $(this).div:parent().attr('class').split(' '); // just a quick try.

* Fondamentalement, je veux obtenir les classes du premier DIV parent de $ (this).

THX

javascript jquery css-selectors Adam
la source

Réponses:

161

Utilisez .closest()pour parcourir l'arborescence DOM jusqu'au sélecteur spécifié.

var classes = $(this).parent().closest('div').attr('class').split(' '); // this gets the parent classes.
Shef
la source
10
parents("div")traverse et retourne tous les div parents que vous devriez utiliser .eq(0)après pour vous assurer qu'il ne renvoie que celui que vous voulez
meo
3
N'oubliez pas qu'il est préférable d'utiliser les performances .parents('div').eq(0)- l'utilisation de ce sélecteur CSS de bourse FOLLOWED by jQuery pour filtrer uniquement sur le premier élément vous donnera une légère amélioration des performances - voir la section 'Notes supplémentaires' sur jQuery: eq doc
Noah Whitmore
@NoahWhitmore l'a corrigé. Utilisé closest()pour ne pas renvoyer tous les parents sauf le divparent.
Shef
41

Utilisez .closest(), qui obtient le premier élément ancêtre qui correspond au sélecteur donné 'div':

var classes = $(this).closest('div').attr('class').split(' ');

ÉDITER:

Comme @Shef l'a noté, .closest()retournera l'élément actuel s'il se trouve être également un DIV. Pour en tenir compte, utilisez d' .parent()abord:

var classes = $(this).parent().closest('div').attr('class').split(' ');
Tatu Ulmanen
la source
5
.closest()se correspondra si $(this)est un élément DIV.
Shef
@ Shef, c'était une nouvelle info pour moi, merci. J'ai modifié ma réponse pour refléter cela.
Tatu Ulmanen
3
vous pouvez simplement utiliser.parents("div").eq(0)
meo
8

Cela obtient le parent s'il s'agit d'un div. Ensuite, ça devient classe.

var div = $(this).parent("div");
var _class = div.attr("class");
Esben
la source
1
@meo C'est ce que la question a posé.
Daniel West
3

Rester simple!

var classes = $(this).parent('div').attr('class');
Daniel West
la source
0

deux des meilleures options sont

$(this).parent("div:first")

$(this).parent().closest('div')

et bien sûr, vous pouvez trouver la classe attr par

$(this).parent("div:first").attr("class")

$(this).parent().closest('div').attr("class")
Junaid Masood
la source