Sử dụng jQuery để tìm div theo màu nền

Question

Tôi đang cố gắng sử dụng jQuery để tìm số lượng div được hiển thị và có màu nền của Xanh lục.

(Thông thường tôi chỉ thêm một lớp vào div, tạo kiểu cho nó màu xanh lá cây và kiểm tra lớp đó trong jQuery nhưng trong trường hợp này, tôi thực sự không thể thay đổi đánh dấu của trang đó theo bất kỳ cách nào)

tôi hiện có div phần nhìn thấy làm việc như:

if( // if there are more than one visible div 
    $('div.progressContainer:visible').length > 0 
){ 

tôi muốn ném một số loại "và màu nền là màu xanh lá cây" selector trong đó.

// not legit javascript 
if( // if there are more than one visible div, and its color is green 
    $('div.progressContainer:visible[background-color:green]').length > 0 
){ 

Có thể thực hiện việc này không?

Answer 1

Nếu bạn sử dụng này trong nhiều hơn một vị trí thường xuyên bạn có thể cũng xem xét viết công cụ chọn tùy chỉnh của riêng bạn (http://answers.oreilly.com/topic/1055-creating-a-custom-filter-selector-with-jquery/)

jQuery.expr[':'].greenbg = function(elem) { 
     return jQuery(elem).css('background-color') === 'green'; 
}; 

Sau đó, bạn chỉ cần làm $('div:visible:greenbg').stuffs()

Answer 2

jQuery không có bộ chọn dựa trên kiểu (trừ :visible), vì vậy bạn không thể làm điều đó.

Bạn có thể sử dụng thay vì filter:

$('div.progressContainer:visible').filter(function() { 
    return $(this).css('background-color') === 'green'; 
}) 

Lưu ý rằng nó sẽ không phù hợp background-color:#0F0.

Answer 3

bạn có thể làm điều này:

if($('div.progressContainer:visible').css('background-color') == 'green'){ 
    //should equal true, if it's green 
} 

Answer 4

Bạn có thể sử dụng filter để tinh chỉnh những gì bạn đang chọn như thế này:

$('div.progressContainer:visible').filter(function(){ 
    return $(this).css('background-color') == 'green'; 
});