Không phải bộ chọn lớp trong jQuery

270

Có một biểu thức chọn đơn giản để không chọn các phần tử với một lớp cụ thể không?

<div class="first-foo" />
<div class="first-moo" />
<div class="first-koo" />
<div class="first-bar second-foo" />

Tôi chỉ muốn có được ba div đầu tiên và thử

$(div[class^="first-"][class!="first-bar"])

Nhưng điều này nhận được tất cả là div cuối cùng chứa nhiều hơn thanh đầu tiên. Có cách nào để sử dụng trình giữ chỗ trong biểu thức như vậy không? Một cái gì đó như thế

$(div[class^="first-"][class!="first-bar*"]) // doesn't seem to work

Bất kỳ lựa chọn khác có thể giúp đỡ?

javascript jquery jquery-selectors

— Zardoz
nguồn

Cào bình luận trước đó của tôi, tôi chỉ đọc lại câu hỏi. Lớp quan trọng là first-bar.

— BoltClock

Trong trường hợp người ta muốn chọn tất cả các phần tử không có class1 hoặc class2, việc ghép nối sẽ hoạt động:$('div[class^="first-"]').not('.class1').not('.class2')

— J0ANMM

Câu trả lời:

543

Bạn cần :not()bộ chọn:

$('div[class^="first-"]:not(.first-bar)')

hoặc, cách khác, .not()phương pháp:

$('div[class^="first-"]').not('.first-bar');

— cô đơn
nguồn

Lưu ý rằng vì: not () nhanh hơn tới 2-3 lần so với .not () ( jsperf.com/jquery-css3-not-vs-not ), bạn có thể muốn sử dụng: not (). Tuy nhiên, thay vào đó, các tài liệu jQuery khuyên bạn nên sử dụng .not (), vì nó dễ đọc hơn ( api.jquery.com/not-selector ). Hy vọng điều này sẽ giúp ai đó đưa ra quyết định giữa hai người!

— rinogo

@rinogo Bây giờ nhanh hơn là phần lớn các trình duyệt hỗ trợ truy vấnSelector ALL, nhưng điều đó không phải luôn luôn như vậy.

— cô đơn

Yup, chính xác! :) Tôi hy vọng bình luận của tôi đã không đi qua như lời chỉ trích; Tôi khá có ý định thêm vào câu hỏi đã hữu ích của bạn.

— rinogo

Cảm ơn!! vô hiệu hóa khóa nhập trên tất cả trừ Hộp lọc của tôi. $ ("input: not (.rgFilterBox)"). keydown (function (e) {if (e.keyCode == 13) {return false;} return true;});

— hardba11

@Daniel, vâng, nhưng nếu có , thì đó là một thay đổi cực kỳ dễ dàng để tăng hiệu suất tức thì :)

— rinogo

Bạn có thể sử dụng :notbộ chọn bộ lọc:

$('foo:not(".someClass")')

Hoặc not()phương pháp:

$('foo').not(".someClass")

Thêm thông tin:

— Sarfraz
nguồn

Các "nên được bỏ qua nếu sử dụng nó như là một bộ chọn CSS.

— BoltClock

@BoltClock: Cần có các giá trị có khoảng trắng trong đó, tôi đã tạo thói quen của mình để chỉ định các giá trị đó luôn :)

— Sarfraz