¿Cómo seleccionar el primer DIV principal usando 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.

El padre en la situación anterior es un ankor.

Si quisiera obtener el primer DIV principal de $ (esto), ¿cómo se vería el código?

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

* Básicamente quiero obtener las clases del primer padre DIV de $ (esto).

Gracias

javascript jquery css-selectors Adán
fuente

Respuestas:

161

Úselo .closest()para recorrer el árbol DOM hasta el selector especificado.

var classes = $(this).parent().closest('div').attr('class').split(' '); // this gets the parent classes.
Shef
fuente
10
parents("div")está atravesando y devuelve todos los div padre que debe usar .eq(0)después para asegurarse de que devuelva solo el que desea
meo
3
Recuerde que es mejor para el rendimiento .parents('div').eq(0): usar ese selector de CSS de bolso SEGUIDO por jQuery para filtrar solo el primer elemento le dará un ligero aumento de rendimiento; consulte la sección 'Notas adicionales' en jQuery: eq doc
Noah Whitmore
@NoahWhitmore Lo arregló. Se usa closest()para que no devuelva todos los padres excepto el divpadre.
Shef
41

Use .closest(), que obtiene el primer elemento ancestro que coincide con el selector dado 'div':

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

EDITAR:

Como señaló @Shef, .closest()devolverá el elemento actual si también es un DIV. Para tener eso en cuenta, use .parent()primero:

var classes = $(this).parent().closest('div').attr('class').split(' ');
Tatu Ulmanen
fuente
5
.closest()coincidirá con sí mismo si $(this)es un elemento DIV.
Shef
@Shef, esa era información nueva para mí, gracias. Edité mi respuesta para reflejar esto.
Tatu Ulmanen
3
simplemente podría usar.parents("div").eq(0)
meo
8

Esto obtiene parent si es un div. Entonces se pone clase.

var div = $(this).parent("div");
var _class = div.attr("class");
Esben
fuente
1
@meo Eso es lo que hacía la pregunta.
Daniel West
3

¡Mantenlo simple!

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

dos de las mejores opciones son

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

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

y, por supuesto, puedes encontrar el atributo de clase por

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

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