Kết hợp bộ chọn lớp và bộ chọn thuộc tính với jQuery

Có thể kết hợp cả bộ chọn lớp và bộ chọn thuộc tính với jQuery không?

Ví dụ: đưa ra HTML sau:

<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>

Điều gì sẽ là công cụ chọn tôi chỉ có thể sử dụng để chọn hàng 1 và 3?

Tôi đã thử:

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

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

Tôi chắc chắn câu trả lời rất đơn giản và tôi đã thử tìm kiếm các diễn đàn và tài liệu về jQuery nhưng dường như tôi không thể tìm ra câu hỏi này. Có ai giúp được không?

Kết hợp chúng. Nghĩa đen kết hợp chúng; gắn chúng lại với nhau mà không có dấu câu nào.

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

Bộ chọn đầu tiên của bạn tìm kiếm các phần tử có giá trị thuộc tính, được chứa trong các phần tử với lớp.
Không gian đang được hiểu là bộ chọn hậu duệ .

Bộ chọn thứ hai của bạn, như bạn đã nói, tìm kiếm các phần tử có giá trị thuộc tính hoặc lớp hoặc cả hai.
Dấu phẩy đang được hiểu là toán tử nhiều bộ chọn - bất kể điều đó có nghĩa là gì (bộ chọn CSS không có khái niệm "toán tử"; dấu phẩy có thể được gọi chính xác hơn là dấu phân cách).

Tôi nghĩ bạn chỉ cần loại bỏ không gian. I E

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

Có một câu đố ở đây http://jsfiddle.net/xXEHY/

Mã này cũng hoạt động:

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

Điều này cũng sẽ làm việc:

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