Buscar todos los elementos en función de los identificadores utilizando expresiones regulares en el selector de jQuery

Question

que tengo varios elementos con los identificadores únicos de este modo:

<div id='item-1-top'></div> 
<div id='item-2-top'></div> 
<div id='item-3-top'></div> 

que estaba esperando que la siguiente sería trabajar con jQuery:

$("#item-[.]+-top").each(function() { 
    $(this).hide(); 
}); 

No tengo una buena comprensión de las expresiones regulares y agradecería algunas aportaciones, ya que lo anterior parece ser incorrecto.

Answer 1

Si que estaba haciendo esto con expresiones regulares, la expresión simple sería:

item-\d-top 

Cuando el \d indica cualquier dígito (0..9), y los otros personajes no tienen un significado especial (entonces son tratados como literales).

Sin embargo, jQuery actualmente no tiene un filtro de expresiones regulares (solo cosas como inicio/fin/contiene/etc) - por lo que tendría que crear el suyo propio (que es posible, pero si usted considera que debería deténgase y considere qué/por qué está filtrando y descubra si hay una manera mejor primero).

Mucho más simple sería crear una clase (como serg555 sugiere), ya que así es exactamente como está tratando estos artículos.

O (si no se puede cambiar el margen de beneficio de añadir la clase) a continuación, utilizar los filtros existentes, ampliando g.d.d.c's answer, que podría hacer:

$('div[id^=item-][id$=-top]').hide() 

(Dado que es posible tener varios elementos que termina con sólo 'superior', ya sea ahora o en el futuro, por lo que necesita para ser más específicos para evitar involuntariamente ocultando otras cosas.)

Answer 2

Yo les asignaría una clase como item y luego haré una búsqueda por esta clase $(".item").

Answer 3

Si la identificación fue algo así como news-top-1, news-top-2, news-top-3, news-top-4 etc. entonces los selectores habría ayudado tú.

http://api.jquery.com/attribute-starts-with-selector/

$.each($("input[name^='news-top-']"), function() { 
    alert($(this).hide()); 
}); 

Answer 4

James Padolsey creado una maravillosa filter que permite la expresión regular que se utilizará para la selección.

jQuery.expr[':'].regex = function(elem, index, match) { 
    var matchParams = match[3].split(','), 
     validLabels = /^(data|css):/, 
     attr = { 
      method: matchParams[0].match(validLabels) ? 
         matchParams[0].split(':')[0] : 'attr', 
      property: matchParams.shift().replace(validLabels,'') 
     }, 
     regexFlags = 'ig', 
     regex = new RegExp(matchParams.join('').replace(/^s+|s+$/g,''), regexFlags); 
    return regex.test(jQuery(elem)[attr.method](attr.property)); 
} 

Ahora puede utilizar

$('div:regex(id,item-[0-9]-top)').hide() 

Answer 5

conectó un problema similar y le gusta/respuesta de serg upvoted de crear clase en lugar pero entonces porque yo estaba haciendo múltiples operaciones sobre dichos elementos, Keyed Collections eran más adecuado.