bộ lọc phần tử jquery bằng css

Question

Tôi muốn chọn từng div có màu nền đỏ chẳng hạn. là điều này có thể trong jquery?

<div style="background-color:red"></div> 
<div style="background-color:white"></div> 
<div style="background-color:red"></div> 
<div style="background-color:yellow"></div> 

cảm ơn bạn

Answer 1

$('div[style=background-color:red]'); 

Answer 2

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

$('div').filter(function() { 
    return this.element.style['background-color'] == 'red'; 
}); 

Nhưng, như tvanfosson đã nói, cách chính xác sẽ được gán một lớp CSS cho mỗi divs của bạn, sau đó bạn có thể gọi các đối tượng bằng cách sử dụng jQuery như thế này (đó là cách ưa thích làm việc với jQuery):

$('.yourCSSClass'); 

Answer 3

tôi nghĩ rằng bạn cần một bộ lọc tùy chỉnh cho rằng nếu bạn không muốn dựa vào một style=xxx thuộc tính nhất định trên thẻ:

$('*').filter(function() { /* check the background color of this */ }); 

Answer 4

Tại sao làm điều đó một cách khó khăn? Một giải pháp tốt hơn là sử dụng các lớp CSS để cung cấp cho các yếu tố của bạn phong cách của họ, sau đó bạn chỉ có thể sử dụng bộ chọn dựa trên lớp.

<style type="text/css"> 
    .alert { 
     background-color: red; 
    } 
</style> 

<div class="alert"></div> 


$('.alert').... 

Answer 5

Trước hết, tôi không bao giờ khuyên bạn nên đặt kiểu trực tuyến trên các phần tử trang. Gán các lớp CSS và kiểm soát màu nền của bạn trong một tài liệu CSS bên ngoài.

<div class="red"></div> 
<div class="white"></div> 
<div class="red"></div> 
<div class="yellow"></div> 

Và trong CSS của bạn:

.red {background-color:red;} 
.white {background-color:white;} 
.yellow {background-color:yellow;} 

Sau đó, nó giúp bạn dễ dàng chọn những màu đỏ bằng cách sử dụng: $('div.red')

Answer 6

Mã này cũng làm việc cho CSS đó là không quy định tại thuộc tính kiểu của thẻ:

$('div').filter(function() { 
    return $(this).css('background-color') == 'red'; 
});