2010-02-12 8 views
83

¿Qué es jQuery tiene un id equivalente a la siguiente declaración?jQuery Determine si una clase coincidente tiene una identificación dada

$('#mydiv').hasClass('foo') 

para que pueda dar un nombre de clase y comprobar que contiene una identificación suministrada.

algo como:

$('.mydiv').hasId('foo') 
+0

quiero aplicar un estilo a una cierta div. Por ejemplo, en el momento de la carga, se mostraría todo con una clase de foo, pero es posible que desee alternar una instancia de la clase foo off que tenga una identificación de barra. –

+1

Entonces simplemente haría '$ ('# bar.foo'). Toggle();' solo tendrá una identificación, ya que SE REQUIERE que sean únicos para el documento. si solo quieres alternar esa identificación si es de la clase 'foo', simplemente agrega la clase al selector de id. si el selector encuentra un conjunto vacío, nada sucederá, si encuentra un conjunto con resultados (del cual solo habrá uno), entonces alternará el elemento. Creo que estás pensando demasiado esto. – prodigitalson

+0

Sí, por supuesto, gracias. –

Respuesta

135

Puedes poner esa lógica en el selector por combining multiple selectors. Por ejemplo, podríamos apuntar a todos los elementos con un identificador dado, que también tiene una clase particular:

$("#foo.bar"); // Matches <div id="foo" class="bar"> 

Debe ser similar a algo que iba a escribir en el CSS. Tenga en cuenta que no se aplicará a todos los elementos #foo (aunque solo debería haber uno), y no se aplicará a todos los elementos .bar (aunque puede haber muchos). Solo hará referencia a los elementos que califican en ambos atributos.

jQuery también tiene un gran .is method que le permite determinar si un elemento tiene ciertas cualidades. Puede probar una colección jQuery contra un selector de cadenas, un elemento HTML u otro objeto jQuery. En este caso, sólo tendremos que comprobarlo con un selector de cadena:

$(".bar:first").is("#foo"); // TRUE if first '.bar' in document is also '#foo' 
+22

+1 para 'es()'. Debería haber un selector '.hasId()' solo porque parece ser un compañero obvio para '.hasClass()' realmente ... –

39

probablemente me gustaría utilizar $('.mydiv').is('#foo'); Dicho esto, si conoce la identificación por qué no podrías sólo se aplican a la selección en el primer lugar?

+17

Tal vez el código vaya a una función de devolución de llamada que debe manejar un caso determinado de manera diferente. Entonces, la función pasa un objeto jQuery automáticamente con atributos desconocidos. En este caso, $ ('su respuesta'). Es ('útil'); –

+1

No puedo pensar en ninguna cantidad de razones. ¿Qué ocurre si desea aplicar una configuración específica para dispositivos móviles, como si un elemento tiene la identificación = "móvil"? El por qué no es importante. – Placeable

+0

Bueno, solo 1 elemento debería tener un 'id' determinado, de lo contrario debería ser algún otro atributo ... Supongo que si la ubicación estructural del elemento en cuestión cambia según la página o cliente/agente de usuario, entonces está bien, pero otros que eso ... – prodigitalson

4
$('#' + theMysteryId + '.someClass').each(function() { /* do stuff */ }); 
+0

cada uno es innecesario porque nunca habrá más de un '# theMysteryId'. – prodigitalson

+2

Bueno, le ahorra la molestia de asignarlo a una variable, verificando si la longitud no está vacía, y luego continuar con el código. Si el selector no coincide con nada, jQuery simplemente no llamará a la función "cada", por lo que es agradable y limpio. Ahora, si todo lo que quiere hacer es llamar a alguna API de jQuery, entonces seguro. – Pointy

4

sólo para decir que finalmente lo resolvió mediante el índice().

NADA más parecía funcionar.

Por lo tanto, para elementos hermanos esto es una buena solución si primero seleccionas una clase común y luego quieres modificar algo diferente para cada clase específica.

EDITAR: para aquellos que no saben (como yo) index() da un valor de índice para cada elemento que coincide con el selector, contando desde 0, dependiendo de su orden en el DOM. Siempre que sepa cuántos elementos hay con class = "foo", no necesita una identificación.

Obviamente, esto no siempre ayudará, pero alguien podría encontrarlo útil.

7

Digamos que usted está iteración a través de algunos objetos DOM y quiero encontrar y coger un elemento con un determinado ID

<div id="myDiv"> 
    <div id="fo"><div> 
    <div id="bar"><div> 
</div> 

Usted puede escribir algo así como encontrar

$('#myDiv').find('#bar') 

Tenga en cuenta que si tuviera que usar un selector de clase, el método de búsqueda devolverá todos los elementos coincidentes.

o usted podría escribir una función de iteración que va a hacer un trabajo más avanzado

<div id="myDiv"> 
    <div id="fo"><div> 
    <div id="bar"><div> 
    <div id="fo1"><div> 
    <div id="bar1"><div> 
    <div id="fo2"><div> 
    <div id="bar2"><div> 
</div> 

$('#myDiv div').each(function() { 
    if($(this).attr('id') == 'bar1') 
     //do something with bar1 
}); 

mismo código podría modificarse fácilmente para selector de clase.

<div id="myDiv"> 
    <div class="fo"><div> 
    <div class="bar"><div> 
    <div class="fo"><div> 
    <div class="bar"><div> 
    <div class="fo"><div> 
    <div class="bar"><div> 
</div> 

$('#myDiv div').each(function() { 
    if($(this).hasClass('bar')) 
     //do something with bar 
}); 

me alegro que resolvió su problema con el índice(), lo que cada vez funciona para you.I Esperamos que esto ayude a otros con el mismo problema. Saludos :)

17

Sé que es cuestión de edad, pero todavía en la parte superior de los resultados de Google, más nuevo jQuery proporcionan .has() función

$('.mydiv').has('#foo') 
+5

Lo siento, pero creo que malinterpretaste la pregunta: [has() API] (http://api.jquery.com/has/) informa esto: Reduce el conjunto de elementos coincidentes a aquellos que tienen un * descendiente * que coincide con el selector o el elemento DOM. El OP pregunta cómo probar si el elemento con la clase 'myDiv' tiene también Id foo, mientras que has() buscará descendientes de 'myDiv' que tengan Id 'foo'. – Tilt

3

Compruebe si el ID del elemento es existir

if ($('#id').attr('id') == 'id') 
 
{ 
 
    //OK 
 
}

-1

También podría verificar si el elemento id se usa así:

if(typeof $(.div).attr('id') == undefined){ 
    //element has no id 
} else { 
    //element has id selector 
} 

Puedo usar este método para tablas de datos globales y las tablas de datos ordenados específicos

Cuestiones relacionadas