Combinación de un selector de clases y un selector de atributos con jQuery

Question

¿Es posible combinar un selector de clase y un selector de atributos con jQuery?

Por ejemplo, dada la siguiente HTML:

<TABLE> 
    <TR class="myclass" reference="12345"><TD>Row 1</TD></TR> 
    <TR class="otherclass" reference="12345"><TD>Row 2</TD></TR> 
    <TR class="myclass" reference="12345"><TD>Row 3</TD></TR> 
    <TR class="myclass" reference="54321"><TD>Row 4</TD></TR> 
</TABLE> 

¿Cuál sería el selector que puedo utilizar para seleccionar las filas 1 y sólo el 3?

que he intentado:

$(".myclass [reference=12345]") // returns nothing 

$(".myclass, [reference=12345]") // returns all 4 rows (yes, I know the comma means 'or') 

estoy seguro de que la respuesta es muy simple y yo hemos tratado de buscar los foros de jQuery y documentación, pero me parece que no puede imaginar éste. ¿Alguien puede ayudar?

Answer 1

Combínalos. Literalmente combine ellos; adjuntar juntos sin ningún tipo de puntuación.

$('.myclass[reference="12345"]') 

Su primer selector busca elementos con el valor de atributo, contenidos en elementos con la clase.
El espacio se está interpretando como descendant selector.

Su segundo selector, como usted dijo, busca elementos con el valor del atributo, o la clase, o ambos.
La coma se interpreta como el operador multiple selector, sea lo que sea lo que signifique (los selectores CSS no tienen una noción de "operadores"; la coma probablemente se conoce con más precisión como un delimitador).

Answer 2

Creo que solo necesitas quitar el espacio. es decir,

$(".myclass[reference=12345]").css('border', '#000 solid 1px'); 

Hay un violín aquí http://jsfiddle.net/xXEHY/

Answer 3

Este código también funciona:

$("input[reference=12345].myclass").css('border', '#000 solid 1px');