2012-07-15 20 views

Respuesta

225
[id^=product] 

^= indica "comienza con". Por el contrario, $= indica "termina con".

Los símbolos se toman prestados de la sintaxis Regex, donde ^ y $ significan "inicio de cadena" y "fin de cadena" respectivamente.

Consulte the specs para obtener información completa.

+0

Gracias por el método y la explicación, he editado mi pregunta para que quede más claro. Por curiosidad, ¿hay alguna manera de hacer coincidir una cadena dentro de la cadena de identificación? – guptron

+0

Ver [las especificaciones] (http://www.w3.org/TR/css3-selectors/#attribute-substrings), ¡lo explican mejor que yo! –

+0

@itamar: Agradezco su intento de editar mi respuesta, pero solo se requieren citas si el valor contiene caracteres que no son un identificador válido. 'product' es claramente un identificador válido, y por lo tanto no necesita comillas. –

44

lo haría así:

[id^="product"] { 
    ... 
} 

Lo ideal es utilizar una clase. Esto es lo que las clases son para:

<div id="product176" class="product"></div> 
<div id="product177" class="product"></div> 
<div id="product178" class="product"></div> 

Y ahora se convierte en el selector:

.product { 
    ... 
} 
+0

@Blender, gracias, elegí la otra respuesta porque me explica un poco más y comprende los símbolos que se usan. No puedo usar clases para este escenario, de lo contrario, sí, sería más agradable. – guptron

0

Me di cuenta de que hay otro selector de CSS que hace lo mismo. La sintaxis es la siguiente:

[id|="name_id"] 

Esto seleccionará todos los elementos de identificación que comienza con la palabra entre comillas dobles.

+0

No funciona –

+0

¿Cómo se dio cuenta? ¿referencia? –

Cuestiones relacionadas